I write this Jquery code in the aspx page for button.
Steps:
Add a button for which you want to have a confirm box, add its jquery and div to show the confirm box.
Register the script for button on Page_Load, and write the methods which will bind this script on button.
Also do not forget the server side method or event for button click, which will be continued after OK confirmation from confirm box.
If cancel is clicked, nothing will happen and div will be closed.
<script type="text/javascript">
function FileItem(callBackFunction, title, content) {
$("#File-confirm").html(content).dialog({
autoOpen: true,
modal: true,
title: title,
resizable: false,
height: 140,
close: function (event, ui) { $(this).dialog("destroy"); },
buttons: {
'Ok': function () {
callBackFunction(); $(this).dialog("destroy");
},
'Cancel': function () {
$(this).dialog("destroy");
}
});
}
}
where SaveBtn is the button in the UI:
<asp:Button ID="SaveBtn" runat="server" Text="File" OnClick="SaveBtn_Click"/>
<div id="File-confirm" style="display: none">
</div>
Again the code behind:
FileConfirmRequest(SaveBtn, "Confirm", "Are you sure you want to file the changes?");
// In the Page_Load, write the above code
//Use this method later on the page
protected void FileConfirmRequest(Button control, string title, string message)
{
string postBackReference = Page.ClientScript.GetPostBackEventReference(control, String.Empty);
string function = String.Format("javascript:FileItem(function() {{ {0} }}, '{1}', '{2}'); return false;", postBackReference, title, message);
control.Attributes.Add("OnClick", function);
}
Now, The Onclick of the Button:
protected void SaveBtn_Click(object sender, EventArgs e)
{
//Do what you want to after OK Click from the confirm box
}