ASP. NET WebForm can also use Ajax (1)

Source: Internet
Author: User

For the WebForm project, there are about three Ajax operations: web Service. asmx file), general processing program. ashx) and some Ajax controls.

For. for the moment, the ajax control provided by. net only needs to introduce additional code files to perform operations on Ajax in the other two methods: asmx and ashx, and the web Service also needs to introduce a cs file), If You Want To Example. add some custom Ajax operations to the aspx page, and these Ajax operations will not be used on other pages, so you have to introduce additional code files to complete this operation. If this Ajax operation is very simple, A simple function can be executed. Isn't it a very troublesome process? As a result, as the number of Ajax operations in the project increases, both the ashx and asmx files will increase over time, and the project maintenance will also double. Why can't we put the background code of Ajax operations directly in the Example. aspx. cs file corresponding to Example. aspx? If you can do this, the above two kinds of troubles will be solved, right?

As a result, the following Ajax framework is implemented based on the above ideas. First, let's look at the implementation mechanism of this framework:

Is a part of the Page lifecycle events in the HTTP application pipeline and Page of The aspx request received by the reduced IIS. Page itself is inherited from the IHttpHandler interface. IHttpHandler provides an important constraint method ProcessRequest, which is used to connect to the received information HttpContext for specific processing, generally, the processing program and web Service also implement their own IHttpHandler and provide some Ajax services. For specific operation procedures, please find MSDN on your own.

The principle is to handle the first event PreInit at the beginning of the page lifecycle. Once the hijacked request is found to be an ajax request, the reflection of C # is used to call aspx. the method defined in cs. After the method is executed, call Response. the End () method directly jumps to the EndRequest event of the pipeline to End the request. In this way, you do not need to take any unnecessary page lifecycle steps to complete an Ajax operation. If a normal operation is found, the normal process is followed.

The following is a simple example to illustrate the use of the Ajax framework:

1. Add a solution

2. Create a new Default. aspx page

3. Create a called test method on the Default. aspx. cs page:

  1. public List<string>  TestAjaxMethod(int a, string b, float c)  
  2.         {  
  3.                return new List<string> { a.ToString(), b, c.ToString() };  
  4.         } 

4. Write an Ajax request in Default. aspx

  1. PowerAjax. AsyncAjax ('testajaxmethod', [1, 2, "333", "sss"], function (SucceessResponse ){
  2. // Code after successful execution
  3. });

PowerAjax. js is a simple JS class library encapsulated by Jquery for this framework. This class library has two main methods: PowerAjax. asyncAjax and PowerAjax. syncAjax provides synchronous operations and asynchronous operations, with three parameters:

The first parameter is the name of the Ajax method to be operated in aspx. cs using the name reflection method ).

The second parameter is an array consisting of parameter list data.

The third parameter is the callback method executed after the operation is successful, which is similar to the delegate in c.

The code for this simple JS library is as follows:

  1. Var PowerAjax = function (){}
  2. PowerAjax. _ Private = function (){}
  3. // Perform asynchronous operations
  4. PowerAjax. AsyncAjax = function (methodName, paramArray, success ){
  5. PowerAjax. _ Private. Ajax (methodName, paramArray, success, true );
  6. }
  7. // Perform synchronization operations.
  8. PowerAjax. SyncAjax = function (methodName, paramArray, success ){
  9. PowerAjax. _ Private. Ajax (methodName, paramArray, success, false );
  10. }
  11. PowerAjax. _ Private. Ajax = function (methodName, paramArray, success, isAsync ){
  12. Var data = {};
  13. Switch (paramArray. length ){
  14. Case 0:
  15. Data = {'isjaxrequest': true, 'methodname': MethodName };
  16. Break;
  17. Case 1:
  18. Data = {'isjaxrequest': true, 'methodname': MethodName, "param0": paramArray [0]};
  19. Break;
  20. Case 2:
  21. Data = {'isjaxrequest': true, 'methodname': MethodName, "param0": paramArray [0], "param1": paramArray [1]};
  22. Break;
  23. Case 3:
  24. Data = {'isjaxrequest': true, 'methodname': MethodName, "param0": paramArray [0], "param1": paramArray [1], "param2 ": paramArray [2]};
  25. Break;
  26. Case 4:
  27. Data = {'isjaxrequest': true, 'methodname': MethodName, "param0": paramArray [0], "param1": paramArray [1], "param2 ": paramArray [2], "param3": paramArray [3]};
  28. Break;
  29. Case 5:
  30. Data = {'isjaxrequest': true, 'methodname': MethodName, "param0": paramArray [0], "param1": paramArray [1], "param2 ": paramArray [2], "param3": paramArray [3], "param4": paramArray [4]};
  31. Break;
  32. }
  33. Var url = document. location. href;
  34. $. Ajax ({
  35. Type: "post ",
  36. Url: url,
  37. Data: data,
  38. Async: isAsync,
  39. Datatype: "json ",
  40. ContentType: "application/x-www-form-urlencoded; charset = UTF-8 ",
  41. Success: function (response ){
  42. Success (response );
  43. },
  44. Error: function (response ){
  45. If (response. status = 500 ){
  46. Var errorMessage = response. responseText;
  47. Var errorTitle = errorMessage. substring (errorMessage. indexOf ("<title>") + 7, errorMessage. indexOf ("</title> "))
  48. Throw new Error ("internal server Error:" + errorTitle );
  49. }
  50. }
  51. });
  52. }

5. Change the inheritance page of Default. aspx. cs to AjaxBasePage.

  1. public partial class _Default : AjaxBasePage 

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.