Geek Answers Handbook

Using jquery-ui dialog as a confirmation dialog with ASP: LinkButton (how to call postbck)

I would like to use the jQuery UI dialog box to implement a confirmation dialog box that appears when the user clicks the delete link (implemented using asp:LinkButton ).
I am using the code as shown below (copied from the jquery ui documentation):

 <!-- 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>

So, in the click event handler, I have to prevent the default action of LinkButton (postback) and display a dialog instead.

My question is: how can I then invoke the default (postback) action of the delete link to perform a postback if the user clicks the Delete All Items button in the dialog box?

+2
source share
7 answers

OK, here is my approach (it works, but it may not be the best solution):

 $(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 href to the dialog .dialog('option', 'onOk', $(this).attr('href')) .dialog('open'); // prevent the default action, eg, following a link return false; }); });
+6
source

If you do nothing but confirm, you can add an attribute to the button.

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

If you look at Project Awesome on Codeplex , it has a common implementation of a confirmation dialog that you can check for your area.

0
source

Try adding $("#yourformid").submit(); to this place // ===>>> how to invoke the default action here . According to docs : "... the default submit action on the form will be launched, so the form will be submitted."

Edit
You can try to do something like this:

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

And then in your function to delete all elements:

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

So, you have disabled the default action for the link (by link), right? Therefore adding location.replace('path/to/file'); after $(this).dialog('close'); will solve your problem.

Not sure if I understood your question correctly.

0
source 
 $('#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 } } });
0
source

If you are using LinkButton, you can do this:

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

0
source

More articles:


All Articles