Readonly checkboxes with JQuery

I have encountered a problem where I needed to disable some checkboxes on my forms. As you know, a disabled html item by design isn’t going to be posted back. So I needed to figure out another solution. So with the disabled tag, we have a readonly tag, which just blurs the checkbox, but lets the user click on it and change the value(I was testing this in Chrome, I don’t know what happens in other browsers). The solution is:

1. Make your checkboxes readonly by setting the readonly attribute to true

<%= check_box_tag "some_id", :readonly => true %>

1. Put this javascript in your document.load so the click will be overridden:

// Javascript:
$(':checkbox[readonly="readonly"]').click(function() {
  return false;
});
// Coffeescript:
$(':checkbox[readonly="readonly"]').click ->
  false