how to submit a form after jquery dialog

Question

I have a mvc4 web application a page with form

@using (Html.BeginForm()) {
    @Html.ValidationSummary(true)

<fieldset>
    <legend>News</legend>
    <div class="editor-label">
        @Html.LabelFor(model => model.title)
    </div>
    <div class="editor-field">
        @Html.EditorFor(model => model.title)
        @Html.ValidationMessageFor(model => model.title)
    </div>

    <div class="editor-label">
        @Html.LabelFor(model => model.summery)
    </div>
    <div class="editor-field">
        @Html.TextAreaFor(model => model.summery)
        @Html.ValidationMessageFor(model => model.summery)
    </div>

    <p>
        <input type="submit" value="Create" />
    </p>
</fieldset>
}

I want after form is valid to call a function that will show a confirm dialog (jquery)

$("#dialog-message").dialog({
        modal: true,
        resizable: false,
        draggable: false,
        title: title, closeOnEscape: false,
        buttons: {
            "OK submit": function () {

            },
            "Cancel Submit": function () {

            }
        }
    });

what is the best whay to do so ? I want the form to be validated ,next step if valid to show confirm message ,next step if "OK submit" pressed to submit the form.

Answer 1

Try this:

$(formSelector).submit(function(){
   var frm = $(this);
  if (frm.validate()) {
  $("#dialog-message").dialog({
        buttons: {
        "OK submit": function () {
              //not sure - here can be a mistake
              frm.unbind('submit');
             frm.sumbit();

        },
        "Cancel Submit": function () {

        }
    }
 });
 }
 return false;

});

If you want to show not a custom dialog you can use this:

 $(formSelector).submit(function(){
  var frm = $(this);
  if (frm.validate()) {
          return confirm("Want to submit?");
     }
  return false;
 });