title: .checked and .disable are not working together in javascript
body: <p>I have 5 checkboxes and if first checkbox is checked then other four checkboxes should also be checked. Also, these checkboxes should be disabled if I uncheck the first checkbox. When I do this, all the other checkboxes are enabled and unchecked so I implement the following code:</p>
  
  <pre><code>&lt;div class="total_line"&gt;
      &lt;label for="name"&gt;Beheerder &lt;/label&gt;
      &lt;%= f.check_box:is_admin, {:onchange =&gt; "showHideDiv()"} %&gt;
  &lt;/div&gt;
  &lt;div class="total_line"&gt;
      &lt;label for="onderwerp"&gt;Documenten beheren&lt;/label&gt;
      &lt;%= f.check_box:document_management %&gt;
  &lt;/div&gt;
  &lt;div class="total_line"&gt;
      &lt;label for="onderwerp"&gt;Nieuws beheren&lt;/label&gt;
      &lt;%= f.check_box:news_management %&gt;
  &lt;/div&gt;
  &lt;div class="total_line"&gt;
      &lt;label for="onderwerp"&gt;Agenda beheren&lt;/label&gt;
      &lt;%= f.check_box:agenda_management %&gt;
  &lt;/div&gt;
  &lt;div class="total_line"&gt;
      &lt;% if photo_book == true %&gt;
          &lt;label for="onderwerp"&gt;Fotoboek beheren &lt;/label&gt;
          &lt;%= f.check_box:photobok_admin %&gt;
      &lt;% end %&gt;
  &lt;/div&gt;
  &lt;div class="total_line"&gt;
      &lt;label for="onderwerp"&gt;Actief&lt;/label&gt;
      &lt;%= f.check_box:is_actived %&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>And following is the javascript</p>
  
  <pre><code>function showHideDiv() {
      var mycheck = document.getElementById('membership_is_admin');
      if (mycheck.checked) {
          document.getElementById('membership_is_admin').setAttribute("readonly", 1)
          document.getElementById('membership_photobok_admin').setAttribute("readonly", 1)
          document.getElementById('membership_news_management').setAttribute("readonly", 1)
          document.getElementById('membership_document_management').setAttribute("readonly", 1)
          document.getElementById('membership_agenda_management').setAttribute("readonly", 1)
          document.getElementById('membership_document_management').checked = true;
          document.getElementById('membership_news_management').checked = true;
          document.getElementById('membership_agenda_management').checked = true;
          document.getElementById('membership_photobok_admin').checked = true;
          jQuery('#membership_document_management').attr('disabled','true');
          jQuery('#membership_news_management').attr('disabled','true');
          jQuery('#membership_agenda_management').attr('disabled','true');
          jQuery('#membership_photobok_admin').attr('disabled','true');
      } else {
          document.getElementById('membership_is_admin').setAttribute("readonly", 0)
          document.getElementById('membership_photobok_admin').setAttribute("readonly", 0)
          document.getElementById('membership_news_management').setAttribute("readonly", 0)
          document.getElementById('membership_document_management').setAttribute("readonly", 0)
          document.getElementById('membership_agenda_management').setAttribute("readonly", 0)
          document.getElementById('membership_document_management').checked = false;
          document.getElementById('membership_news_management').checked = false;
          document.getElementById('membership_agenda_management').checked = false;
          document.getElementById('membership_photobok_admin').checked = false;
          document.getElementById('membership_document_management').disabled = false;
          document.getElementById('membership_news_management').disabled = false;
          document.getElementById('membership_agenda_management').disabled = false;
          document.getElementById('membership_photobok_admin').disabled = false;
      }
  }
  </code></pre>
  
  <p>The problem is value of the other four checkboxes are not becoming checked.
  If I take out the code of the disable the checkboxes then it is working.</p>