Реализовать подтверждение jQuery в форме submit?

Я использую модальное подтверждение jQuery следующим образом:

$(function() {
    $( "#dialog-confirm" ).dialog({
      resizable: false,
      height:190,
      width: 330,
      modal: true,
      buttons: {
        "Yes": function() {
          $( this ).dialog( "close" );
        },
        No: function() {
          $( this ).dialog( "close" );
        }
      }
    });
  });

  <div id="dialog-confirm" title="Genalytics">
  <p><span class="ui-icon ui-icon-alert" style="float: left; margin: 0 7px 20px 0;"></span>Are you sure want to unshare?</p>
</div>

У меня есть кнопка ввода в форме:

<input type="submit" value="Unshare" name="unshare" />

Я хочу открыть диалоговое окно, когда пользователь нажимает кнопку. Как я могу это сделать?

Ответ 1

вам нужно использовать событие отправки в форме, в которой находится кнопка отправки.

$(function() {
    var submit = false;
    $("#dialog-confirm").dialog({
      resizable: false,
      height:190,
      autoOpen: false,
      width: 330,
      modal: true,
      buttons: {
        "Yes": function() {
          $(this).dialog("close");
          submit = true;
        },
        No: function() {
          $(this).dialog("close");
        }
      }
    });

    $('form').submit(function() {
        if (!submit) {
            $("#dialog-confirm").dialog('open');
            return false;
        }
    });
});

Ответ 2

Я создал всплывающее окно модели без собственного плагина третьей стороны.

Не могли бы вы попробовать данную ссылку.

<input type="button" id="btnShowSimple" value="Simple Dialog" />
<input type="button" id="btnShowModal" value="Modal Dialog" />

См. демонстрацию

Надеюсь, вам понравится.