ASP. NET: Learn Ajax step by step (2) using the POST method

The previous article learned how to use the get method in Ajax for direct transmission. Next we will learn another method of passing values: Post.

There are several differences between get and post methods:

1. The security of the get method is very low. The passed value is transmitted through the address. Of course, the address will not appear in Ajax. It is worth noting that the browser address does not support Chinese characters. If the passed value is Chinese, garbled characters may occur. You Need To transcode the address before passing the value. Post does not need to consider these issues.

2. The get method can only be used for the transfer of small data volumes, not greater than 2 kb. The post method theoretically has no limit on the maximum value, which depends on the server.

There are also two methods to pass values using post. One is to pass values through header files, and the other is to send values directly using send.

I. Use the header file to upload values:

View code

 1    VaR XMLHttpRequest = New Activexobject ( "  Microsoft. XMLHTTP  " );
 2 Function getdata () //  Pass values through header files  
  3    {
 4 XMLHttpRequest. Open ( "  Post  " , "  Handler1.ashx  " , True );
 5 XMLHttpRequest. onreadystatechange = setvalue;
 6 XMLHttpRequest. setRequestHeader ( "  Content-Type  " , "  Application/X-WWW-form-urlencoded; charset = gb2312  " );
 7 XMLHttpRequest. setRequestHeader ( "  User  " , Document. getelementbyid ( " Select  " ). Value );
 8 XMLHttpRequest. Send ( Null );
 9 }
 10 Function setvalue (){
 11               If (XMLHttpRequest. readystate = 4 & XMLHttpRequest. Status = 200 ){
 12 Document. getelementbyid ( "  Textarea1  " ). Value = XMLHttpRequest. responsetext; //  The obtained text data is not garbled  
  13    Document. getelementbyid ( "  Textarea2  " ). Value + = XMLHttpRequest. getResponseHeader ( "  Detail  " ); //  Obtain the uploaded header file, which is garbled in Chinese.  
  14    }
 15 }

Data transmission in the background can be divided into two types: one is through the header file; the other is through the XMLHttpRequest communication.

1. use the header file to pass: context. response. addheader ("detail", DS. tables [0]. rows [0] [0]. tostring (); that is, to add the detail attribute, assign a value to this attribute.

The obtained value is similar to the obtained property value: String result = XMLHttpRequest. getResponseHeader ("detail ");

2. normal communication transmission: context. response. write (Ds. tables [0]. rows [0] [0]. tostring (); write data directly. Of course, you can write data in JSON or XML format as needed.

The obtained value is string result = XMLHttpRequest. responsetext;

II. Send to pass the value:

View code

 1 Function getdatabysend () //  Pass the value through send  
  2    {
 3 XMLHttpRequest. onreadystatechange = setdatabysend;
 4 XMLHttpRequest. Open ( "  Post  " , " Handler2.ashx  " , True );
 5 XMLHttpRequest. setRequestHeader ( "  Content-Type  " , "  Application/X-WWW-form-urlencoded; charset = UTF-8  " );
 6 XMLHttpRequest. Send ( "  User = test1 & Index = 2 " );
 7 }
 8 Function setdatabysend (){
 9               If (XMLHttpRequest. readystate = 4 & XMLHttpRequest. Status = 200 ){
 10 Document. getelementbyid ( "  Data  " ). Value = XMLHttpRequest. responsetext;
11 }
 12 }

When sending is used, multiple parameter values are separated by &. The parameter values obtained in the background are:

String user = context. Request. Params ["user"];
Int Index = convert. toint32 (context. Request. Params ["Index"]);

The data sent in the background is the same as the header file, so it is not repeated here.

ArticleSorry!

I often encounter problems when using Ajax, such as failure to obtain data and ineffective interface operations. Pass CheckCodeIt is difficult to find out what went wrong. In addition, JavaScript code cannot be used for breakpoint debugging. However, I used a third-party browser, and later I used IE, because the IE browser has the error reporting function. If an error occurs on the interface, there is a warning icon in the lower left corner of the browser. Double-click the icon to find out what went wrong. Then you can solve the problem by looking at it.Because the above JavaScript code cannot be intelligently displayed, I suspect that the case may be incorrect. So I tried it one by one, at least in my environment, I don't know if the case is true or not. In my opinion, JavaScript should be okay because it is a scripting language. Please let me know.

Click here to download the source code.