我想使用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
(回发)的默认操作,而是显示对话框。
我的问题是:如果用户点击对话框中的“删除所有项目”按钮,我怎么能调用删除链接的默认操作(回发)来执行回发?
答案 0 :(得分:6)
好的,这是我的方法(它有效,但可能不是最佳解决方案):
$(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;
});
});
答案 1 :(得分:1)
如果您没有做任何其他事情,只需确认您可以为按钮添加属性。
<asp:LinkButton ID="btnDelete" runat="server" Text="Delete"
OnClientClick="if(!confirm('Are you sure?'))return false;" CssClass="btnDelete"></asp:LinkButton>
答案 2 :(得分:0)
如果查看Project Awesome on Codeplex,它有一个确认对话框的通用实现,您可以检查您的范围。
答案 3 :(得分:0)
尝试在此地点$("#yourformid").submit();
添加// ===>>> how to invoke the default action here
。
根据{{3}}:“...表单上的默认提交操作将被触发,因此表单将被提交。”
修改强>
您可以尝试这样做:
$('.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]);
},
答案 4 :(得分:0)
所以你阻止了链接的默认动作(在链接之后),对吗?因此,在location.replace('path/to/file');
之后添加$(this).dialog('close');
可以解决您的问题。
不确定我是否理解你的问题。
答案 5 :(得分:0)
$('#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
}
}
});
答案 6 :(得分:0)
如果您使用的是LinkButton,则可以执行以下操作:
__ doPostBack(&#34;&lt;%= lnkMyButton.UniqueID%&gt;&#34;,&#34;&#34;);