How to get blank checkboxes to pass as false to params

Question

I have a form that is an update user form where several of the elements are checkboxes. I want true to pass to the params if checked (this is working) and false to pass to the

Answer 1

The problem is if you use a hidden attribute before a checkbox and give it the same reference like this:

<%= hidden_field_tag :basketball, false %>
<%= check_box_tag :basketball, checked = true %> Basketball

Then if you want to do any type of dynamic action on an attribute, say like $("#basketball").removeAttr("checked") it will target the first instance of $("#basketball") which in this case is the hidden object.

What I ended up doing in my implementation was to add a default value of false to my checkboxes since my default setting was to be unchecked. Then in my jquery I detected a change on the checkbox elements and grabbed the ID of that checkbox. When a change is detected I evaluated the checked property for true or false and set the value attribute accordingly.

$(".checkbox").on('change', function(e) {
  var that;
  that = "#" + e.target.getAttribute("id");
  if ($(that).prop("checked") === true) {
    $(that).val("true");
  }
  if ($(that).prop("checked") === false) {
    return $(that).val("false");
  }
});

When I submit my PUT method form action it is updating the database record correctly with the boolean value even if it is blank.