|
-
Using a Javascript confirmation popup correctly
Hello,
I am trying to use Javascript within an ASP.NET web page to create an alert confirmation popup. A certain function run if a user clicks Yes or No to the alert popup. I have tried the following code so far.
The HTML code is as follows:
Code:
<%@ Page Language="vb" AutoEventWireup="false" Codebehind="manage.aspx.vb" Inherits="Contractors.manage"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" />
<html lang="en">
<head>
<title>Contractors and Consultants Induction Search Tool</title>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<meta http-equiv="Content-Style-Type" content="text/css">
<link rel="stylesheet" href="style.css" type="text/css">
<script language="Javascript">
function deleteperson() {
var x = confirm('Are you sure you would like to delete this person?');
if (x == true) {
alert('You clicked yes');
}
else {
alert('You clicked cancel, goodbye');
}
}
</script>
</head>
<body>
<form id="form1" method="post" runat="server">
<table id="table1" cellspacing="0" cellpadding="0" border="0">
<tbody>
<tr>
<td width="20" background="images/topleft_corner.gif" height="20"></td>
<td background="images/top_border.gif" height="20"></td>
<td width="20" background="images/topright_corner.gif" height="20"></td>
</tr>
<tr>
<td width="20" background="images/left_border.gif"></td>
<td valign="top" bgcolor="#f5f5f5"><span class="title">
Contractors and Consultants Database Search</span><br />
<br />
<asp:linkbutton id="lnkAdd" runat="server" text="Add"></asp:linkbutton> -
<asp:linkbutton id="lnkEdit" runat="server" text="Edit"></asp:linkbutton> -
<asp:linkbutton id="lnkDelete" runat="server" text="Delete"></asp:linkbutton> -
<asp:linkbutton id="lnkLogout" runat="server" text="Logout"></asp:linkbutton><br />
<br />
<!-- Add Panel -->
<asp:panel id="pnlAdd" runat="server" visible="false">
<table id="table2" cellpadding="10" width="600" align="center">
<tr>
<td colspan="2" valign="top">
<p>To add a new person, please fill in the form below.
</p>
</td>
</tr>
<tr>
<td class="info" valign="top">
<table id="Table3" cellpadding="10">
<tr>
<td class="heading2">First Name:</td>
<td>
<asp:textbox id="txtAddFirstName" runat="server"></asp:textbox></td>
</tr>
<tr>
<td class="heading2">Surname:</td>
<td>
<asp:textbox id="txtAddSurname" runat="server"></asp:textbox></td>
</tr>
<tr>
<td class="heading2">Address:</td>
<td>
<asp:textbox id="txtAddAddress" runat="server"></asp:textbox></td>
</tr>
<tr>
<td class="heading2">Contact Number:</td>
<td>
<asp:textbox id="txtAddContactNumber" runat="server"></asp:textbox></td>
</tr>
<tr>
<td class="heading2">Vendor Number:</td>
<td>
<asp:textbox id="txtAddVendorNumber" runat="server"></asp:textbox></td>
</tr>
<tr>
<td class="heading2">Date Issued:</td>
<td>
<asp:textbox id="txtAddDateIssued" runat="server"></asp:textbox></td>
</tr>
<tr>
<td colspan="2">
<asp:Button id="cmdAdd" runat="server" Text="Add"></asp:Button></td>
</tr>
</table>
</td>
</tr>
</table>
</asp:panel>
<!-- Edit Panel -->
<asp:panel id="pnlEdit" runat="server" visible="false">
<table id="table4" cellpadding="10" width="600" align="center">
<tr>
<td colspan="2" valign="top">
<p>To edit a person's details, please select them from the listbox.
</p>
</td>
</tr>
<tr>
<td class="info" valign="top">
<asp:listbox id="lstEdit" runat="server" Rows="12"></asp:listbox>
<p>
<asp:button id="cmdSelectPerson" runat="server" Text="Edit"></asp:button></p>
</td>
<td class="info" valign="top">
<table id="table5" cellpadding="10">
<tr>
<td class="heading2">First Name:</td>
<td>
<asp:textbox id="txtEditFirstName" runat="server"></asp:textbox></td>
</tr>
<tr>
<td class="heading2">Surname:</td>
<td>
<asp:textbox id="txtEditSurname" runat="server"></asp:textbox></td>
</tr>
<tr>
<td class="heading2">Address:</td>
<td>
<asp:textbox id="txtEditAddress" runat="server"></asp:textbox></td>
</tr>
<tr>
<td class="heading2">Contact Number:</td>
<td>
<asp:textbox id="txtEditContactNumber" runat="server"></asp:textbox></td>
</tr>
<tr>
<td class="heading2">Vendor Number:</td>
<td>
<asp:textbox id="txtEditVendorNumber" runat="server"></asp:textbox></td>
</tr>
<tr>
<td class="heading2">Date Issued:</td>
<td>
<asp:textbox id="txtEditDateIssued" runat="server"></asp:textbox></td>
</tr>
<tr>
<td colSpan="2">
<asp:button id="cmdEdit" runat="server" Text="Save"></asp:button></td>
</tr>
</table>
</td>
</tr>
</table>
</asp:panel>
<!-- Delete Panel -->
<asp:panel id="pnlDelete" runat="server" visible="false">
<table id="table6" cellpadding="10" width="600" align="center">
<tr>
<td class="info" valign="top">
<p>To delete a person, please select them from the listbox.
</p>
<asp:listbox id="lstDelete" runat="server" Rows="12"></asp:listbox>
<p>
<!--<asp:Button id="cmdDelete" runat="server" Text="Delete"></asp:Button>-->
<input type="button" id="cmdDelete2" value="Delete" OnClick="deleteperson()" /></p>
</td>
</tr>
</table>
</asp:panel><br />
<div style="text-align: right"><a href="index.aspx">Index</a></div>
</td>
<td width="20" background="images/right_border.gif"></td>
</tr>
<tr>
<td width="20" background="images/bottomleft_corner.gif" height="20"></td>
<td background="images/bottom_border.gif" height="20"></td>
<td width="20" background="images/bottomright_corner.gif" height="20"></td>
</tr>
</tbody>
</table>
</form>
</body>
</html>
I haven't included the behind code because it wouldn't fit. The behind code just holds functions for executing the .NET Web Forms that are in the HTML page, if possible, it would be good if after the user clicks the Yes button from the confirmation alert the function, "cmdDelete" from the behind code is executed. I'm trying to create the popup with the user clicks the Delete button in the 'Delete' Panel shown in the HTML page. If anyone knows how I can go about doing this it would be really helpful and much appreciated, thank you.
Regards,
Alex Clifford
-
See if this helps: http://builder.com.com/5100-6371-5031730.html
There's plenty more where that came from if you search Google for "asp.net confirmation dialog" and/or "asp.net message box".
Phil Weber
http://www.philweber.com
Please post questions to the forums, where others may benefit.
I do not offer free assistance by e-mail. Thank you!
-
return true/false
Hi..
Return a false or true in the onclick event..
in the button:
Code:
<input type="button" id="cmdDelete2" value="Delete" OnClick="return deleteperson();" />
in the script:
Code:
function deleteperson() {
return confirm('Are you sure you would like to delete this person?');
}
This will return true if the user clicked "OK", and false if the user click "Cancel".
if true is returned in the onClick event then the page will proceed with the postback. Otherwise the page just stop like that and cancel the postback.
Hope this helps...
Posting Permissions
- You may not post new threads
- You may not post replies
- You may not post attachments
- You may not edit your posts
-
Forum Rules
|
Development Centers
-- Android Development Center
-- Cloud Development Project Center
-- HTML5 Development Center
-- Windows Mobile Development Center
|
Reply With Quote
