Note that there are some explanatory texts on larger screens.

plurals
  1. POHow to work with checkboxes in jQuery?
    primarykey
    data
    text
    <p>I'm relatively new to the concept dealing with checkboxes in jQuery. I have three checkboxes with same name. Now I want to apply some condition depending upon selection of the first checkbox only. For your reference my HTML code is as below:</p> <pre><code>&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt; &lt;html xmlns="http://www.w3.org/1999/xhtml"&gt; &lt;head&gt; &lt;script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"&gt; &lt;/script&gt; &lt;/head&gt; &lt;body&gt; &lt;table&gt; &lt;tr&gt; &lt;td&gt; &lt;input type="checkbox" id="users" value="users"/&gt;Users &lt;/td&gt; &lt;td&gt; &lt;input type="checkbox" id="upload_from_file" value="upload_from_file"/&gt;Upload From File &lt;/td&gt; &lt;td&gt; &lt;input type="checkbox" id="copy_paste_from_excel" value="copy_paste_from_excel"/&gt;Copy paste from excel &lt;/td&gt; &lt;/tr&gt; &lt;tr&gt; &lt;td colspan="3"&gt; &lt;h4&gt;Users&lt;/h4&gt; &lt;input type="checkbox" class="user_checkbox" name="user_checkbox" id="all_users" value="all_users"/&gt;all users &amp;nbsp;&amp;nbsp; &lt;input type="checkbox" class="user_checkbox" name="user_checkbox" id="register_users" value="register_users"/&gt;Register users &amp;nbsp;&amp;nbsp; &lt;input type="checkbox" class="user_checkbox" name="user_checkbox" id="package_expired" value="package_expired"/&gt;Package expired &amp;nbsp;&amp;nbsp; &lt;input type="checkbox" class="user_checkbox" name="user_checkbox" id="inactive_from_last_month" value="inactive_from_last_month"/&gt;Inactive from last month &lt;/td&gt; &lt;/tr&gt; &lt;/table&gt; &lt;/body&gt; &lt;/html&gt; </code></pre> <p>My requirement is when user checks the checkbox having value <code>"users"</code> then he/she must select at least one checkbox from the group of checkboxes having values(<code>"register_users"</code>, <code>"package_expired"</code>, <code>"inactive_from_last_month"</code>).</p> <p>One more condition is that when the user selects the checkbox having value <code>all_users</code> all other checkboxes from the same group i.e checkboxes having values(<code>"register_users"</code>, <code>"package_expired"</code>, <code>"inactive_from_last_month"</code>) should be disabled.</p> <p>One more condition is that when user selects any one of these check boxes the checkbox <code>"all_users"</code> should be disabled.</p> <p>Can anyone help me in achieving this functionality using jQuery? Thanks in advance. You can correct my code if somewhere I'm going wrong in above code. I've also attached the screenshot of UI.</p> <p><img src="https://i.stack.imgur.com/g8OL5.png" alt="enter image description here"></p>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

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