表单提交或不提交的jQuery对话框

Question

我正在使用jQuery对话框进行确认，无论是Submit表单还是Not
在提交表单之前我正在做一些验证。当我单击提交按钮时，它首先提醒 End，它位于提交按钮单击处理程序的末尾，并且我的验证失败
以下是我的代码 sn-p

$('#id-submit-btn').click( function( event ) {
    //var $this = $(this);
    var submit = true;
    if( !$('.class-employees-cb:checked').length ) {
        $("<div title='Employee Selection'>Please select at least one employee.</div>").dialog({
            buttons: [ { text: 'OK', click: function() { $(this).dialog('close'); } } ]
        });
        submit = false;
        //event.preventDefault();
        //alert("2");
    }
    if( $('input:checkbox[name=isPrepondPostpond]').is(':checked') ) {
        //event.preventDefault();
        $("<div title='Prepond/Postpond Alert'>Have You Changed Meeting Date before Prepond / Postpond ?</div>").dialog({
            buttons:[
                {
                    text: 'Yes',
                    click: function() {
                        $(this).dialog('close');
                        $('#id-submit-btn').submit();
                    }
                },
                {
                    text: 'No',
                    click: function() {
                        submit = false;
                        //event.preventDefault();
                        $(this).dialog('close');
                    }
                }
            ]
        });
        //alert("5");
    }
    alert("End");
    //event.preventDefault();
    if( !submit )
        return false;
});

我想阻止表单提交如果用户点击否，如何实现？

Answer 1

试试这个

$('#id-submit-form').on("submit", function(event) {
  event.preventDefault(); // cancel the submission
  if (!$('.class-employees-cb:checked').length) {
    $("<div title='Employee Selection'>Please select at least one employee.</div>").dialog({
      buttons: [{
        text: 'OK',
        click: function() {
          $(this).dialog('close');
        }
      }]
    });
  }
  if ($('input:checkbox[name=isPrepondPostpond]').is(':checked')) {
    $("<div title='Prepond/Postpond Alert'>Have You Changed Meeting Date before Prepond / Postpond ?</div>").dialog({
      buttons: [{
          text: 'Yes',
          click: function() {
            $(this).dialog('close');
            $('#id-submit-form')[0].submit(); // submit the form
          }
        },
        {
          text: 'No',
          click: function() {
            $(this).dialog('close');
          }
        }
      ]
    });
  }
});