by
James Fielding
18. March 2010 13:53
Intro | Part 1 | Part 2
So we're on the third instalment of this three-part tutorial series, where you and I are building an AJAX Contact Us form in ASP.NET, a couple of different ways. If you need a recap, here are the links to the introduction and the partial-page updates method. In this article we’re going to put the "less is more" principle into action by initiating our network callbacks directly from client-side JavaScript code, and we'll also build an AJAX-enabled web service to handle our call. As in Part 1, I’m going to assume that you are comfortable using Visual Studio.
You can download the source files for this project AJAXEnabledContactForm.zip (45.6 kb).
So we're going from partial-page updates using the asp:UpdatePanel, to network callbacks through a web service using HTML controls. The main reason you'd go this way is to drastically reduce your data transfer between the client and server. And why is this? Well, for two reasons: First, unlike partial-page updates, we're not passing all the form's data back to the server, just the required parameters in an XML wrapper. Second, we're not executing the page's full life-cycle back on the server from the postback, either. So if you're looking for efficiency, this is the way to go.
We'll be continuing on with the project that we created in Part 1, which we called “AjaxEnabledContactForm”. Let's start with the our web service, which is going to provide the service methods that our Contact Us form calls. So I`ve created a new web service called "ContactUs.asmx". Since we've already seen the some of this code in Part 1, I'll give you the full page first, and then we'll walk through it.
Imports System.Web.Services
Imports System.Web.Services.Protocols
Imports System.ComponentModel
<System.Web.Script.Services.ScriptService()> _
<System.Web.Services.WebService(Namespace:="http://xmlforasp.net")> _
<System.Web.Services.WebServiceBinding(ConformsTo:=WsiProfiles.BasicProfile1_1)> _
Public Class ContactUs
Inherits System.Web.Services.WebService
<WebMethod()> _
Public Function Submit(ByVal strEmail As String, ByVal strComment As String) As Boolean
System.Threading.Thread.Sleep(5000)
Return SendMail(strEmail, strComment)
End Function
Private Function SendMail(ByVal strEmail As String, ByVal strComment As String) As Boolean
Dim mailMessage As System.Net.Mail.MailMessage = New System.Net.Mail.MailMessage()
mailMessage.From = New System.Net.Mail.MailAddress("myserver@mysite.com")
mailMessage.To.Add(New System.Net.Mail.MailAddress("me@mysite.com"))
mailMessage.ReplyTo = New System.Net.Mail.MailAddress(strEmail.Trim())
'Set additional options
mailMessage.Priority = Net.Mail.MailPriority.Normal
mailMessage.IsBodyHtml = False
'Set the subjet and body text
mailMessage.Subject = "Contact Us Form from: " & strEmail.Trim
mailMessage.Body = strComment
'Create an instance of the SmtpClient class for sending the email
'using web.config settings
Dim smtpClient As System.Net.Mail.SmtpClient = New System.Net.Mail.SmtpClient()
Try
smtpClient.Send(mailMessage)
Catch ex As System.Net.Mail.SmtpException
Return False
Catch ex As Exception
Return False
Finally
mailMessage.Dispose()
End Try
Return True
End Function
End Class
The nice thing about doing our Contact Us form through a web service is that we can have both as a separate applications in our production evironment, so if there is a problem in our main application, the service is still available for other applications, or vice-versa. More...
by
James Fielding
12. March 2010 20:13
Intro | Part 1 | Part 2
As promised in the intro of this three-part series, you and I are going to build an AJAX Contact Us form in ASP.NET, a couple of different ways. Today we’re going to look to Visual Studio’s built in ASP.NET AJAX controls to do dynamic partial-page updates, and we’ll leave client-side network callbacks through a web service for a future post. To keep things moving, I’m going to assume that you are comfortable using Visual Studio. If you need to brush up, there are some great tutorials at ASP.NET.
You can download the source files for this project AJAXEnabledContactForm.zip (46 kb).
To start, I created a new AJAX Enabled Web Application in Visual Studio (you can find the free Visual Studio Express Edition here). I called the project “AjaxEnabledContactForm”, but you can call it whatever you want.
Next, I implement a Specified Pickup Directory method to test our contact form, and allow our web app to save notification emails to our c:\Temp\ folder. You can find the specifics of adding this to your own project in my post on The SMTP Alternative, but to keep this short, the code you need to add to your web.config file is as follows:
<configuration>
....
<system.net>
<mailSettings>
<smtp deliveryMethod="SpecifiedPickupDirectory">
<specifiedPickupDirectory pickupDirectoryLocation="c:\Temp\" />
</smtp>
</mailSettings>
</system.net>
....
</configuration>
Now, we need a page for our Contact Us form. I created a new page, called it "PartialPageUpdate.aspx", and added the following content to the body. More...