[javascript] jQuery see if any or no checkboxes are selected

I know how to see if an individual checkbox is selected or not.

But Im having trouble with the following - given a form id I need to see if any of the checkboxes are selected (i.e 1 or more), and I need to see if none are selected. Basically I need two separate functions that answer these two questions. Help would be appreciated. Thanks!

Actually, I would just need a function to tell me if none are selected. Knowing this would answer the other question.

This question is related to javascript jquery forms

The answer is


You can use something like this

if ($("#formID input:checkbox:checked").length > 0)
{
    // any one is checked
}
else
{
   // none is checked
}

Without using 'length' you can do it like this:

if ($('input[type=checkbox]').is(":checked")) {
      //any one is checked
}
else {
//none is checked
}

This is the best way to solve this problem.

  if($("#checkbox").is(":checked")){

  // Do something here /////

  };

JQuery .is will test all specified elements and return true if at least one of them matches selector:

if ($(":checkbox[name='choices']", form).is(":checked"))
{
    // one or more checked
}
else
{
    // nothing checked
}

You can do a simple return of the .length here:

function areAnyChecked(formID) {
  return !!$('#'+formID+' input[type=checkbox]:checked').length;
}

This look for checkboxes in the given form, sees if any are :checked and returns true if they are (since the length would be 0 otherwise). To make it a bit clearer, here's the non boolean converted version:

function howManyAreChecked(formID) {
  return $('#'+formID+' input[type=checkbox]:checked').length;
}

This would return a count of how many were checked.


This is what I used for checking if any checkboxes in a list of checkboxes had changed:

$('input[type="checkbox"]').change(function(){ 

        var itemName = $('select option:selected').text();  

         //Do something.

});     

Rahul's answer is best fit for your question. Anyway, if you have a group of checkboxes to be checked and not all the checkbox in your form, you can go for it.

Put a classname for all the checkboxes you want to check, say for example, a classname test_check and now you can check if any of the checkbox is checked belonging to the group by:

$("#formID .test_check:checked").length > 0

If it returns true, assume that one or more checkboxes are checked having the classname test_check and none checked if returns false.

Hope it helps someone. Thanks :)-


You can do this:

  if ($('#form_id :checkbox:checked').length > 0){
    // one or more checkboxes are checked
  }
  else{
   // no checkboxes are checked
  }

Where:

  • :checkbox filter selector selects all checkbox.
  • :checked will select checked checkboxes
  • length will give the number of checked ones there

Examples related to javascript

need to add a class to an element How to make a variable accessible outside a function? Hide Signs that Meteor.js was Used How to create a showdown.js markdown extension Please help me convert this script to a simple image slider Highlight Anchor Links when user manually scrolls? Summing radio input values How to execute an action before close metro app WinJS javascript, for loop defines a dynamic variable name Getting all files in directory with ajax

Examples related to jquery

How to make a variable accessible outside a function? Jquery assiging class to th in a table Please help me convert this script to a simple image slider Highlight Anchor Links when user manually scrolls? Getting all files in directory with ajax Bootstrap 4 multiselect dropdown Cross-Origin Read Blocking (CORB) bootstrap 4 file input doesn't show the file name Jquery AJAX: No 'Access-Control-Allow-Origin' header is present on the requested resource how to remove json object key and value.?

Examples related to forms

How do I hide the PHP explode delimiter from submitted form results? React - clearing an input value after form submit How to prevent page from reloading after form submit - JQuery Input type number "only numeric value" validation Redirecting to a page after submitting form in HTML Clearing input in vuejs form Cleanest way to reset forms Reactjs - Form input validation No value accessor for form control TypeScript-'s Angular Framework Error - "There is no directive with exportAs set to ngForm"