Published: Sunday, February 18, 2001
Dynamically Creating Client-Side Script for Form Deletion Confirmations
By Roderick Thompson
| To Learn More... |
|---|
|
To learn more about both client-side and server-side form validation be sure to check out
the Form Validation Article Index.
This article presents its code using VBScript, which will only work in IE. For a JavaScript
implementation, which will work in both Netsacpe and IE, be sure to read:
JavaScript Confirm Form Submission!
|
Introduction
During a recent visit to the ASPFAQs.com site
I came across a question that
someone had asked: "How can I pop up a message from ASP? An alert box,
when something goes wrong. A 'confirm' dialog showing details of a record to
make sure the user really wants to delete the record?".
The response given to the question
seemed to suggest that this was something
that could not be achieved because the MsgBox command is not available with
server-side scripting. Whilst this is true, it is somewhat of an over
simplification since we can use Active Server Pages to dynamically write
necessary client-side scripting into the client.
In this short article we are going to primarily look at what was asked in
the original question: simply, can we confirm the deletion of a database
record using a popup message box? The concepts behind this, namely
dynamically generating client side scripting, provide an opportunity to
greatly increase the interactivity with the visitor.
The Problem Using Pure Server-Side ASP
Because the server-side ASP is executed before being sent to the client, a
MsgBox function were it available would actually display the pop-up on the
server. Not very useful and likely to annoy some poor sysadmin somewhere!
Add a Dash Of Client Side Scripting
Lets step back for a moment and look at what we are trying to acheive in
broader terms. The fact that we are confirming the deletion of a database
record is not important at this stage; what we are really saying is that we
want to provide a means of confirming a form submission even after the
submit button has been pressed. Our first suggestion over how we can do this
comes from the OnSubmit event of the form.
Lets look at a basic form:
<SCRIPT LANGUAGE="VBScript">
Function MyForm_onSubmit
MsgBox "Form was clicked"
End Function
</SCRIPT>
<FORM METHOD="POST" ACTION="mypage.asp" NAME="MyForm">
<INPUT TYPE="SUBMIT" NAME="btnSUBMIT" VALUE="Click Here">
</FORM>
|
When the above form is submitted a pop-up message will appear which when
clicked will cause the form to redirect to script mypage.asp. Note
that the above code snippet will only work in Internet Explorer since it uses VBScript as
a client-side scripting language. To work in Netscape, the client-side SCRIPT block
would need to be coded in JavaScript. (For more information on client-side JavaScript be sure to
check out our JavaScript Tutorials Index Page.)
On a browser that doesn’t happen to support any scripting (or doesn't support VBScript), it will continue
to process the form regardless, omitting the popup message.
We can see from
the above that using the onSubmit as above we can implement a number of
client side options when the form is fired such as form validations.
This just leaves us with one issue. Can we abort the submission of a form if
a certain condition has not been met? The onSubmit event when enclosed
within a function can be assigned a Boolean value which by setting to false
causes the form submission to be cancelled.
Lets look at a simple example the uses this:
<SCRIPT LANGUAGE="VBScript">
Function MyForm_onSubmit
If Msgbox("Are you sure?", vbYesNo + vbExclamation) = vbNo Then
MyForm_onSubmit = False
End If
End Function
</SCRIPT>
<FORM METHOD="POST" ACTION="http://www.microsoft.com" NAME="MyForm">
<INPUT TYPE="SUBMIT" NAME="btnSUBMIT"
VALUE="Click Here to go to Microsoft.Com">
</FORM>
|
This form confirms the redirection to a form script (in this case a site).
Note that we don’t need to say MyForm_onSubmit = True since this will be
assumed.
Its not quite as simple however when we return to our original problem. When
allowing a user to confirm the deletion of a specific record, we may have
more than one record showing on the page. In this instance we need to
dynamically generate our client side function we looked at above to allow us
to have more than one form and corresponding function.
Lets look at a simple ASP form template that allows for the deleting of
records with confirming (you can also download
a demo ASP page and database for this script!):
<%
Set Conn=Server.CreateObject("ADODB.Connection")
Conn.Open DataSourceName
If Len(Request.Form("Delete") ) > 0 Then
IDOfItem=Request.Form("ID")
Conn.Execute ("DELETE FROM TableName WHERE ID=" & IDOfItem)
End If
Set GetAll=Conn.Execute("SELECT ID, Name FROM TableName")
Do Until GetAll.EOF
ItemID = GetAll("ID") 'Store the ID of the current item
Response.Write GetAll("Name") 'Output the name
'Create a form with a dynamic NAME and a DELETE BUTTON
Response.Write "<FORM METHOD=""POST"" ACTION=""thispage.asp""" & _
"NAME=""Delete" & ItemID & """>"
Response.Write "<INPUT TYPE=""HIDDEN"" NAME=""ID"" VALUE=""" & _
ItemID & """>" & vbCrLf
Response.Write "<INPUT TYPE=""SUBMIT"" NAME=""Delete"" " & _
"VALUE=""Delete"">" & vbCrLf
Response.Write "</FORM>" & vbCrLf & vbCrLf
'Create a client-side script block to handle this form's onSubmit
Response.Write "<SCRIPT LANGUAGE=""VBScript"">" & vbCrLf
Response.Write "Function Delete" & ItemID & "_onSubmit" & vbCrLf
Response.Write "If MsgBox(""Are You Sure"", vbYesNo + " & _
"vbExclamation) = vbNo Then Delete" & _
ItemID & "_onSubmit=False" & vbCrLf
Response.Write "End Function" & vbCrLf
Response.Write "</SCRIPT>" & vbCrLf
Response.Write "<BR><BR>" & vbCrLf & vbCrLf
GetAll.MoveNext
Loop
|
What we have done is enclosed each delete button within its own unique form
where the form name is based on the ID (Primary Key) of the database field.
We have then added a simple client side function which provides a
confirmation of this delete. When confirmation is accepted, the asp code at
the top of the page will delete the required entry.
Conclusion
Our examples here will only work on Internet Explorer since we used VBScript
on the client. JavaScript however can be equally used (for an example of this check out Nannette Thacker's
article: JavaScript Confirm Form Submissions).
Where scripting is
unsupported, the code will continue to work but without the confirmation. I
hope that this article gives you an introduction to how adding a little
client scripting can be used to make your pages a little more interesting.
By Roderick Thompson:
MCSE, Technical Director,
KLIK4.COM
Attachments / Recommend Articles:
Download an example script / database (in ZIP format)
Read Creating Smart JavaScript Popups
Read JavaScript Confirm Form Submission
