Использование диалога jquery-ui в качестве диалога подтверждения с ASP: LinkButton (как вызвать postbck)

Question

Я хотел бы использовать диалоговое окно jQuery UI для реализации диалогового окна подтверждения, которое отображается, когда пользователь нажимает ссылку удаления (реализовано с помощью asp:LinkButton).
Я использую код, показанный ниже (скопированоиз документации по jquery ui):

<!-- the delete link -->
<asp:LinkButton ID="btnDelete" runat="server" Text="Delete"
  OnClick="btnDelete_Click" CssClass="btnDelete"></asp:LinkButton>

<!-- the confirm-dialog -->
<div id="dialog-confirm-delete" title="Delete?" style="display:none;">
  <p>Are you sure you want to permanently deleted the selected items?</p>
</div>

<script>
$(document).ready(function () {
    // setup the dialog
    $('#dialog-confirm-delete').dialog({
        autoOpen: false,
        modal: true,
        buttons: {
          "Delete all items": function () {
                 $(this).dialog("close");
                 // ===>>> how to invoke the default action here
              },
          Cancel: function () { $(this).dialog("close"); }
        }
    });

    // display the dialog
    $('.btnDelete').click(function () {
        $('#dialog-confirm-cancel').dialog('open');
        // return false to prevent the default action (postback)
        return false;
    });

});
</script>

Поэтому в обработчике событий click я должен запретить действие по умолчанию LinkButton (обратная передача) и вместо этого отобразить диалоговое окно.

У меня такой вопрос: как я могу затем вызвать действие по умолчанию (обратную передачу) ссылки удаления для выполнения обратной передачи в случае, если пользователь нажал кнопку «Удалить все элементы» в диалоговом окне?

Answer 1

ОК, вот мой подход (он работает, но, возможно, это не лучшее решение):

$(document).ready(function () {
  $('#dialog-confirm-cancel').dialog({
    autoOpen: false,
    modal: true,
    buttons: {
      "Delete all items": function () {
        // invoke the href (postback) of the linkbutton,
        // that triggered the confirm-dialog
        eval($(this).dialog('option', 'onOk'));
        $(this).dialog("close");
      },
      Cancel: function () { $(this).dialog("close"); }
    }
  });

  $('.btnDelete').click(function () {
    $('#dialog-confirm-delete')
      // pass the value of the LinkButton's href to the dialog
      .dialog('option', 'onOk', $(this).attr('href'))
      .dialog('open');
    // prevent the default action, e.g., following a link
    return false;
  });
});

Answer 2

Если вы не делаете ничего, кроме подтверждения, вы можете добавить атрибут к кнопке.

<asp:LinkButton ID="btnDelete" runat="server" Text="Delete"
  OnClientClick="if(!confirm('Are you sure?'))return false;" CssClass="btnDelete"></asp:LinkButton>

Answer 3

Если вы используете LinkButton, вы можете сделать это:

__ doPostBack ("<% = lnkMyButton.UniqueID%>", "");

Answer 4

$('#dialog-confirm-delete').dialog({
   autoOpen: false,
   modal: true,
   buttons: {
       Cancel: function() {
           $(this).dialog("close");
       },
       "Delete all items": function() {
           $(this).dialog("close");
           // ===>>> how to invoke the default action here
       }
   }
});

Answer 5

То есть вы предотвратили действие ссылки по умолчанию (по ссылке), верно?Поэтому добавление location.replace('path/to/file'); после $(this).dialog('close'); решит вашу проблему.

Не уверен, что я правильно понял ваш вопрос.

Answer 6

Попробуйте добавить $("#yourformid").submit(); в этом месте // ===>>> how to invoke the default action here.В соответствии с docs : "... действие отправки формы по умолчанию будет запущено, поэтому форма будет отправлена."

Edit
Вы можете попробовать сделать что-то вроде этого:

$('.btnDelete').click(function (event, confirmed) {
    if (confirmed) {
        return true;
    } else {
        $('#dialog-confirm-cancel').dialog('open');
        // prevent the default action, e.g., following a link
        return false;
    }
});

А затем в вашей функции удаления всех элементов:

"Delete all items": function () {
    $(this).dialog("close");
    $('.btnDelete').trigger("click", [true]);
},

Answer 7

Если вы посмотрите на Project Awesome в Codeplex , он имеет общую реализацию диалога подтверждения, которую вы можете проверить на предмет своей области.