Micheal
Micheal

Reputation: 2322

how to verify if a checkbox is checked in jQuery before submission

<select name="status" id='status'>
    <option value="Submitted">Submitted</option>
    <option value="Canceled">Canceled</option>

</select>
<input type="checkbox" id="app_box" name="application_complete" value="checked"> App Complete

<script type="text/javascript">
$(function() {

    $('form.editable').submit(function(){ 
        if ($('#status').val()=='Canceled') { 
            if (!confirm('This  information will be discarded! )) { 
                return false; 
            } 
        } 
    }); 

}); 
</script>

So, I have the above script which works fine. I have to add one more confirmation. When the agent clicks on the submit button , I want to check if the application check box is checked or not. If it is not checked then display another confirmation box saying, you have to check the box. How can this be done in jquery.

Upvotes: 4

Views: 16544

Answers (4)

Sarfraz
Sarfraz

Reputation: 382696

Like this:

if ($('#app_box').is(':checked')){...}

Or

if ($('#app_box')[0].checked){...}

So here is how your code should be:

$('form.editable').submit(function(){ 
    if (! $('#app_box')[0].checked){
       alert('Check App Complete first !');
       return false;
    }

    if ($('#status').val() == 'Canceled') { 
        if (!confirm('This  information will be discarded!' )) { 
            return false; 
        } 
    } 
}); 

Learn more:

Upvotes: 10

Felipe Oriani
Felipe Oriani

Reputation: 38608

you can try something like this:

<script type="text/javascript">
$(function() {

    $('form.editable').submit(function(){ 
        if ($('#status').val()=='Canceled') { 

            //check if the box is checked!
            if ($("#app_box").is(':checked')) {
               alert("You have to check the box 'App Complete'"); 
               return false;
            }

            if (!confirm('This  information will be discarded! )) { 
                return false;
            } 
        } 
    }); 

}); 
</script>

I hope it helps!

Upvotes: 0

DG3
DG3

Reputation: 5298

$("input[name='application_complete']").is(":checked"))

Upvotes: 0

Christoph
Christoph

Reputation: 51211

:checked

(Documentation is your best friend...)

Upvotes: 1

Related Questions