Ajax POST request
As kind of a followup to my post about how to redirect XmlHttpRequests outside your domain, which was more popular that I had expected, I want to show you how to accept posted data from your Ajax requests.
When you are opening a request, you have the option of a “GET” or a “POST”, there are many limitations of just using “GET”, which I won’t discuss here. We are using Ajax to run our custom content management system, where users had a WYSIWYG editor to edit their content. You certainly cannot use a “GET” request to send the html content back to the server, so this is a great time to “POST” the data instead.
What we wanted to do was essentially post an xml document back to the server, and xml document that would be constructed in javascript, and then submitted for processing on the server. Inside this xml document we would put the WYSIWYG editor value, as well as other data from the form. So we packaged up the data in javascript in the usual way and then we posted the data. Below I have the code that I use to retrieve the data and populate an XmlDocument using that data.
1 #region Using directives
2
3 using System;
4 using System.IO;
5 using System.Xml;
6 using System.Collections.Specialized;
7
8 #endregion
9
10 namespace XmlPost
11 {
12 public class XmlPostPage : System.Web.UI.Page
13 {
14 protected override void OnInit(EventArgs e)
15 {
16 Load += new EventHandler(Page_Load);
17 }
18
19 private void Page_Load(object sender, System.EventArgs e)
20 {
21 string postedData = “”;
22 //
23 // Read the xml string that was posted in the Request.InputStream
24 //
25 using( StreamReader sr = new StreamReader(Request.InputStream) )
26 {
27 postedData = sr.ReadToEnd();
28 }
29
30 //
31 // Load the posted xml into an XmlDocument to
32 // do whatever actions need to be done
33 //
34 XmlDocument xd = new XmlDocument();
35 xd.LoadXml(postedData);
36
37 //
38 // …..continue processing xml data as needed
39 //
40
41 }
42 }
43 }
So using this method allows you to post just about anything you normally would, and you still get the benefit of the asynchronous behavior. What I want to try next is “POST”-ing a file input over an Ajax request, I think you could make a really nice looking file uploader by uploading the file asynchronously and showing the user a nice “Waiting….” message.
Anonymous said,
Wrote on April 25, 2005 @ 11:53 am
Anonymous said,
Wrote on April 25, 2005 @ 11:54 am
Anonymous said,
Wrote on July 3, 2005 @ 11:40 am
Have you made any progress on uploading a file, via an AJAX control?
Anonymous said,
Wrote on August 19, 2005 @ 8:20 pm
I have tried to create an open source library for _easy_ AJAX communication, with nice callback functionality for your app to proceed server response.
http://unips.sourceforge.net/devblog/?page_id=2
Anonymous said,
Wrote on January 7, 2006 @ 5:20 pm
http://unips.sourceforge.net/devblog/?p=6
Faruk Buker said,
Wrote on August 8, 2006 @ 7:12 am
Hi Everybody,
I understand that article but i dont understand sending image to php script with use ajax or xmlhttprequest.
If your send my e-mail address this question foo answer, i’m very quote happy.
See you’ter.
ben said,
Wrote on August 8, 2006 @ 10:36 am
Faruk, I don’t think it’s possible to upload files using the XMLHttpRequest object. I recall reading somewhere that it’s not allowed.
Doug said,
Wrote on September 11, 2006 @ 10:05 pm
Any luck with the file uploader?