Note that there are some explanatory texts on larger screens.

plurals
  1. PODisplay Checkboxes on Click of a button
    text
    copied!<p>I have a button Resend , and on click of it , the checkboxes get enable against the following:</p> <ul> <li><code>id="AlertSent"</code></li> <li><code>id="AlertNotSent"</code> </li> <li><code>id="AlertInProgress"</code></li> </ul> <p>Now the DIV Code for Above mentioned DIVS is as below </p> <pre><code>&lt;div class="span9"&gt; &lt;div class="row-fluid"&gt; &lt;div id="enableCheckBox" class ="span12"&gt; &lt;input type="checkbox" id="checkbox1" name="checkbox1"/&gt; &lt;/div&gt; &lt;div id="AlertSent" class="span12"&gt; &lt;label&gt;&lt;spring:message code='alert.sent' /&gt;:&lt;/label&gt; &lt;/div&gt; &lt;/div&gt; &lt;div class="row-fluid"&gt; &lt;div id="enableCheckBox" class ="span12"&gt; &lt;input type="checkbox" id="checkbox2" name="checkbox2"/&gt; &lt;/div&gt; &lt;div id="AlertNotSent" class="span12"&gt; &lt;label&gt;&lt;spring:message code='alert.not.sent'/&gt;:&lt;/label&gt; &lt;/div&gt; &lt;/div&gt; &lt;div class="row-fluid"&gt; &lt;div id="enableCheckBox" class ="span12"&gt; &lt;input type="checkbox" id="checkbox3" name="checkbox3" class="required" /&gt; &lt;/div&gt; &lt;div id="AlertInProgress" class="span12"&gt; &lt;label&gt; &lt;spring:message code='alert.in.progress' /&gt;:&lt;/label&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; </code></pre> <p>The button Code for Resend and Done is</p> <pre><code>&lt;input type="button" value="button" id="resend"/&gt; &lt;input type="button" value="button" id="done"/&gt; </code></pre> <p>The JQuery Code is </p> <pre><code>var j$ = jQuery.noConflict(); j$(document).ready(function() { var resendbtn = j$('#resend'); var allChkBox = j$('input[name="enableCheckBox"]'); var verifyChecked = function() { if ! $('#resend').click { allChkBox.attr('disabled', 'disabled'); } else { allChkBox.removeAttr('disabled'); } }; verifyChecked(); resendbtn.change(verifyChecked); }); </code></pre> <p>The requirement is on click of Resend, the checkboxes appear against above DIVS (<code>AlertSent</code>, <code>AlertNotSent</code> and <code>AlertInProgress</code>), and the Resend button Becomes Done, and if a User unchecks all the checkboxes then the Done Button becomes Resend again. </p> <p>How do I write a JQuery/JavaScript code to achieve above?</p> <p>Please suggest </p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload