开发者

Best way to add "uncheck radiobuttons" - functionality in Rails?

Scenario: I have a dropdown-list with radiobuttons, that are not required to be selected to submit the form, and after I've chosen an option, from there on it's impossible to deselect it. I want it to be possible somehow.

Thoughts for solutions: 1) Implement some feature that enables you to deselect the radiobutton, much like a checkbox. This seems like a poor idea.

2) Add a 'reset radiobutton' option in the dropdown-list, that resets the radiobuttons when selected.

3) Add a 'reset all radiobuttons' button. Possibly for all dropdowns on the page.

4) Create a 'placeholder' option in the dropdown-list, that does nothing. The question here is, if I already made a selection X and submitted the form, if I later on choose selection Placeholder, any data that was saved when selection X was made has to be reverted.

So far I'm thinking option 2 is the best, but want to hear your ideas. This is the code that I'm working with right now:

<% form.inputs do %>
      <% @account.account_preference.editorial_attributes.each do |key, value| %>
        <%= account_pref.input "editorial_#{key}".to_sym, :as => :radio, :collection => (options_for(Editorial, key.to_sym) + option_text_and_value("Reset radiobuttons")), :wrapper_html => { :class => "compact" }, :label => key.titleize  %>
      <% end %>

Where options_for(Editorial, key.to_sym) c开发者_如何学Goollects the options that actually do something, and option_text_and_value("Reset radiobuttons") is supposed to add another option that I then can link to the functionality to uncheck the radiobuttons. This doesn't quite work as expected, as option_text_and_value returns two options instead of one. I have tried to search for some other option method on apidock but haven't found one yet. This isn't the primary question but if anyone knows about this and comments I'd be very grateful.

So to wrap it up: What way to go do you think is the best?

Regards, Emil


Radio buttons are meant to choose something out of a group of options. Any time I see a group of radio buttons with none selected, I think whoever designed it doesn't understand radio buttons. Maybe you need to add a "None of the above" radio button?


I don't know why on earth you would want to put radio buttons in a drop down list. That sounds confusing to users. Why not just select the drop down option the normal way? Is this a business requirement?

If you absolutely have to do it, I think option 2 is the best one you've presented, although I don't know if it needs to be an option in the drop down list. It might work better as a link or a button next to or under the list. The list and the link (or button) should be in a containing div so that the corresponding drop down is easy to find, in the event that you have multiple drop downs like this on the page. From there it's easy enough to attach some javascript to the link (or button) which will deselect all radio buttons in the list.

But I still suggest that having radio buttons in a drop down list is just bad design from a user's perspective and I have no idea what this would accomplish.


I have a similar problem actually, and there is definitely sometimes a requirement to deselect a form element built out of radio buttons.

At the moment I am working on a multi-step form that has only a few required fields (think questionnaire), with the user being able to step back to previous pages in the form, allowing to deselect previous answers filled in by radio buttons.

The problem is not so much deselecting the radio buttons, this can be easily done by hanging some jQuery on the element, and controlling it through its events, but Rails is being too clever in its posting of the form data, leaving out fields that have no value, and therefor not updating the value to nil in the database, leaving me with the originally selected value when I step back in the form.

So what I am thinking of doing is having a model method for radio button fields that will empty out the values when nothing is being submitted for a particular page (the one each particular radio button fields lives on).

As for your original question: Just create a jQuery click event for your radio button control (by HTML class), and onclick you check whether the option value clicked, has its checked='checked' set, and if so, remove the checked option and it should deselect (theoretically).


I agree with @davidkovsky's answer. But i used this hint to implement toggle feature for rails radio button. We can add a hidden radio button with the same key and check it once we click on an already checked radio button.

<div style="display:none"> 
    <%= form.radio_button :key_1, id:"hiddenselector"  %>
</div>

<%= form.radio_button :key_1, class: "key1selector" %>

$(document).on('click', '.key1selector', function() {
    if($(this).hasClass('checked')){
      $(this).prop('checked', false);
      $('#hiddenselector').prop('checked', true);
      $('#hiddenselector').attr('checked', 'checked');
    }else{
      $(this).prop('checked', false);
      $(this).addClass('checked');
    }
});

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜