Question

I have a form in a jquery dialogue. How do I get the values of the selected checkboxes once the form is submitted?

$(document).ready(function(){

var $dialog = $('<div></div>')
    .html('<form id="myform" action=""><input type="checkbox"   id="completeCheck" name="completeCheck" value="" />Complete check<br /><input type="checkbox" name="view" value="Car" /> View report <br /><input type="checkbox" name="consist" value="" />Consistency check<br /><input type="checkbox" name="other" value="" />Other checks<br /><input type="checkbox" name="keyCheck" value="" />Key check<br /><input type="checkbox" name="compareCheck" value="" />Compare check<br /></form>')
    .dialog({
        autoOpen: false,
        title: 'Data check',
        buttons: {
          "Submit Form": function() {  $('form#myform').submit();},
          "Cancel": function() {$(this).dialog("close");}
        }
    });

$('#createNew').click(function() {
    $dialog.dialog('open');
    // prevent the default action, e.g., following a link
    return false;
});

$('form#myform').submit(function(){

  $dialog.dialog('close');
});        


});

Answer 1

Working demo http://jsfiddle.net/9mZAJ/2/ or http://jsfiddle.net/9mZAJ/1/

$('#completeCheck').is(':checked') will do the trick along with .each loop on checkbox rest see demo and below code.

This should help

Now to loop through all the check boxes you can do that in several ways using .each and with is(":checked") check. :)

code

$(document).ready(function(){

var $dialog = $('<div></div>')
    .html('<form id="myform" action=""><input type="checkbox"   id="completeCheck" name="completeCheck" value="" />Complete check<br /><input type="checkbox" name="view" value="Car" /> View report <br /><input type="checkbox" name="consist" value="" />Consistency check<br /><input type="checkbox" name="other" value="" />Other checks<br /><input type="checkbox" name="keyCheck" value="" />Key check<br /><input type="checkbox" name="compareCheck" value="" />Compare check<br /></form>')
    .dialog({
        autoOpen: false,
        title: 'Data check',
        buttons: {
          "Submit Form": function() {  $('form#myform').submit();},
          "Cancel": function() {$(this).dialog("close");}
        }
    });

$('#createNew').click(function() {
    $dialog.dialog('open');
    // prevent the default action, e.g., following a link
    return false;
});

$('form#myform').submit(function(){
    alert('completeCheck checkobox is checked or not ==> ' + $('#completeCheck').is(':checked'));

  $dialog.dialog('close');
});        


});​

loop like this

$(this).find('input[type="checkbox"]').each(function(){
    alert($(this).is(':checked'));
})

Image