CODEWITHSUNDEEP
html
user4092077
user4092077

Reputation:

HTML 5 make Checkbox required

I have multiple checkbox on my form. I need to make user to select atleast one checkbox or else the form will not submit. I tried required attribute but it checks if user has checked all check boxes.

How to do this?

Upvotes: 0

Views: 4886

Answers (2)

user2466202
user2466202

Reputation: 1205

One solution is to add required attributes to all the checkboxes, and when at least one of these checkboxes is checked, remove the required attributes for all the checkboxes using jQuery. 

var requiredCheckboxes = $(':checkbox[required]');

requiredCheckboxes.change(function(){
    if(requiredCheckboxes.is(':checked')) {
        requiredCheckboxes.removeAttr('required');
    }
    else {
        requiredCheckboxes.attr('required', 'required');
    }
});

DEMO

Upvotes: 2

Alexander
Alexander

Reputation: 171

You can use Javascript that just loops through your html checkboxes and sets the Variable issomethingchecked to TRUE if at least one of them is cheched .

demo http://jsfiddle.net/updpxrfj/2/

        var checkboxElements = document.getElementsByTagName("input");
        var issomethingchecked = false;

        for(var i = 0; i < checkboxElements.length; i++) {

        if(checkboxElements[i].type.toLowerCase() == 'checkbox') {

            if (checkboxElements[i].checked == true) {
                issomethingchecked = true;
            }

        }

            if (issomethingchecked === true) {
                // Continue with submiting the form
                  console.log(issomethingchecked);
            }
}

Upvotes: 0

Related Questions