Using javascript to check if an array of check boxes have been selected

Question

So i have a list of check boxes created through unique values of a query. Once i have these values i was to check and make sure the user has checked at least one before being able to submit the form to be exported as an excel document. if they have not checked one box then i was it to send an alert and cancel the submit.

here is my script:

     document.getElementById('btnPrint').onclick = function(){
     var checkOperator = $('input[name="OperatorName[]"]:checked').length;

     if(!checkOperator){
         alert('It worked!')
         return false;
     }
     return true;
 };

    <input type="submit" name="btnSubmit" value="preview" onclick="submitForm('index.php')"/>
<input type="submit" id="btnPrint" name="btnSubmitPrint" value="print" onsubmit="submitForm('exportExcel.php')"/>

what's happening now is that it is still exporting to excel and not showing the alert and canceling.

Korgrue · Accepted Answer · 2016-01-14 22:43:57Z

2

You are comparing a boolean against a number. Try this instead:

 if(checkOperator > 0){
     alert('It worked!')
     return false;
 }

answered Jan 14, 2016 at 22:43

Korgrue

3,4781 gold badge15 silver badges21 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

jeffrey verret Over a year ago

it did not download the excel sheet but it still is not showing the alert for some reason.

Korgrue Over a year ago

add either a console.log() or an alert to output the value of checkOperator. Make sure that you are targeting the DOM element correctly. If you check a box, your output should be 1. If it is not, then you are not targeting the DOM element(s) correctly, so length is going to return a null.

cssyphus · Accepted Answer · 2016-01-14 22:51:49Z

1

Here's how you would do it with jQuery (since that is a valid tag for your question, and it is automatically cross-browser, and less typing...):

var cnt = 0;
$('#btnPrint').click(function(){
    $('input[type=checkbox]').each(function(){
        if ( $(this).prop('checked') ) cnt++;
    });
    if (cnt==0){
        alert('Please check a checkbox');
        return false;
    }
});

jsFiddle Demo

answered Jan 14, 2016 at 22:51

cssyphus

40.5k21 gold badges104 silver badges125 bronze badges

Comments

Vignesh Sn · Accepted Answer · 2016-01-14 22:48:42Z

0

Simply return in your method return checkOperator !== 0;

answered Jan 14, 2016 at 22:48

Vignesh Sn

1209 bronze badges

Collectives™ on Stack Overflow

Using javascript to check if an array of check boxes have been selected

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related