"An analysis of the Ajaxpro implementation mechanism" Ajaxpro what work does the interior do for us?

Source: Internet
Author: User
Tags array object extend key string version tojson xmlns
Ajax

First find an excuse: good early to analyze the Ajaxpro code to implement the mechanism, has been suffering from no time, now finally have so little, opening, and slowly analysis ...

Start with one of the simplest examples:
Click on a client button to trigger a JavaScript function, execute a server-side method with only one string parameter, and return a processed string, which will be processed by turning the incoming string into "Hi" +string +! Simple enough, in order to be not want wordy code impact simple analysis;
All the code is as follows:
<%@ Page language= "C #" autoeventwireup= "true" codefile= "Test.aspx.cs" inherits= "Test"%>

<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">

    <title> Untitled page </title>
    <script type= "Text/javascript" >
    
    function dotest ()
    {
         AJAXDemo.Examples.Test.TestMethod.GetTest ("Ajaxpro", dotest_callback);
   }

    function Dotest_callback (res) {
         alert (res.value);
   }
   
    </script>
<body>
     <form id= "Form1" runat= "Server"
    <div>
         <input id= "Button1" type= "button" value= "Test"/></DIV>
    </form>
</body>
Test.aspx.cs
Public partial class Test:System.Web.UI.Page
{
     protected void Page_Load (object sender, EventArgs e)
    {
         Utility.registertypeforajax (typeof (AJAXDemo.Examples.Test.TestMethod));
   }
}
AJAXDemo.Examples.Test
using System;
Using Ajaxpro;

Namespace AJAXDemo.Examples.Test
{
public class TestMethod
{
Public TestMethod ()
{}

[Ajaxmethod]
public string Gettest (string testtext)
{
Return "Hi," + Testtext + "!";
}
}
}
1. First we look at the Ajaxpro on the page to create what?
TEST[1]
<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">

No title page
</title>
<script type= "Text/javascript" >

function Dotest ()
{
AJAXDemo.Examples.Test.TestMethod.GetTest ("Ajaxpro", dotest_callback);
}

function Dotest_callback (res) {
alert (Res.value);
}

</script>
<body>
<form name= "Form1" method= "Post" action= "Test.aspx" id= "Form1" >
<div>
<input type= "hidden" name= "__viewstate" id= "__viewstate" value= /dq== "/>
</div>

<script type= "Text/javascript" src= "/ajaxdemo.2/ajaxpro/prototype.ashx" ></script>
<script type= "Text/javascript" src= "/ajaxdemo.2/ajaxpro/core.ashx" ></script>
<script type= "Text/javascript" src= "/ajaxdemo.2/ajaxpro/converter.ashx" ></script>
<script type= "Text/javascript" src= "/ajaxdemo.2/ajaxpro/ajaxdemo.examples.test.testmethod,app_ Code.un7rskvh.ashx "></script>

<div>
<input id= "Button1" type= "button" value= "Test"/></div>
</form>
</body>
Be sure to pay attention to these lines
<script type= "Text/javascript" src= "/ajaxdemo.2/ajaxpro/prototype.ashx" ></script>
<script type= "Text/javascript" src= "/ajaxdemo.2/ajaxpro/core.ashx" ></script>
<script type= "Text/javascript" src= "/ajaxdemo.2/ajaxpro/converter.ashx" ></script>
<script type= "Text/javascript" src= "/ajaxdemo.2/ajaxpro/ajaxdemo.examples.test.testmethod,app_ Code.urx4hqkg.ashx "></script>
By using HTTP://LOCALHOST:3578/AJAXDEMO.2/AJAXPRO/PROTOTYPE.ASHX and http://localhost:3578/AJAXDemo.2/ajaxpro/ Core.ashx is not difficult to find, the first two are the source code with two JS files (Core.js and prototype.js) converted, the basic content is the same as the original file, and Converter.ashx and AJAXDemo.Examples.Test.TestMet What's inside the hod,app_code.urx4hqkg.ashx? Look below:
Ajaxdemo.examples.test.testmethod,app_code.urx4hqkg.ashx
AddNamespace ("AJAXDemo.Examples.Test");
AJAXDemo.Examples.Test.TestMethod_class = Class.create ();
AJAXDemo.Examples.Test.TestMethod_class.prototype = (new Ajaxpro.ajaxclass ()). Extend ({
Gettest:function (testtext) {
Return This.invoke ("Gettest", {"Testtext": Testtext}, this.) Gettest.getarguments (). Slice (1));
},
Initialize:function () {
This.url = '/ajaxdemo.2/ajaxpro/ajaxdemo.examples.test.testmethod,app_code.un7rskvh.ashx ';
}
});
AJAXDemo.Examples.Test.TestMethod = new AJAXDemo.Examples.Test.TestMethod_class ();
Converter.ashx

AddNamespace ("Ajax.web");

Ajax.Web.NameValueCollection = function ()
{
This.__type = "System.Collections.Specialized.NameValueCollection";

This.add = function (key, value) {
if (this[key] = = null) {
This[key] = value;
}
}

This.getkeys = function () {
var keys = [];

For (key in this)
if (typeof This[key]!= "function")
Keys.push (key);

return keys;
}

This.getvalue = function (key) {
return This[key];
}

This.tojson = function () {
var o = this;
O.tojson = null;
Delete O.tojson;
return Ajaxpro.tojson (o);
}
}


AddNamespace ("Ajax.web");

Ajax.Web.DataTable = function (columns, rows) {

This.__type = "System.Data.DataTable, System.Data";
This. Columns = new Array ();
This. Rows = new Array ();

This.addcolumn = function (name, type) {
var c = new Object ();
C.name = Name;
C.__type = type;

This. Columns.push (c);
}

This.tojson = function () {
var dt = new Object ();

Dt. Columns = [];
for (var i=0; i<this. Columns.length; i++)
Dt. Columns.push ([this.] Columns[i]. Name, this. Columns[i].__type]);

Dt. Rows = [];
for (var i=0; i<this. Rows.length; i++) {
var row = [];
for (var j=0; j<this. Columns.length; J + +)
Row.push (this. Rows[i][this. COLUMNS[J]. Name]);
Dt. Rows.push (row);
}

return Ajaxpro.tojson (DT);
}

This.addrow = function (row) {
This. Rows.push (row);
}

    if (columns!= null) {
        for (var i=0; i< Columns.length; i++) {
            this.addcolumn (columns[i][0], COLUMNS[I][1]);
       }
   }

if (rows!= null) {
for (var i=0; i<rows.length; i++) {
var row = new Object ();
for (var c=0; c<this. Columns.length && c<rows[i].length; C + +) {
Row[this. COLUMNS[C]. Name] = Rows[i][c];
}
This.addrow (row);
}
}
}


AddNamespace ("Ajax.web");

Ajax.Web.DataSet = function (tables) {
This.__type = "System.Data.DataSet, System.Data";
This. Tables = new Array ();

this.addtable = function (table) {
This. Tables.push (table);
}

if (tables!= null) {
for (var i=0; i<tables.length; i++) {
This.addtable (Tables[i]);
}
}
}

function person (ID) {
This. FirstName = "";
This. Familyname = "";
This. Age = 0;
This.id = ID;
This.__type = ' AJAXDemo.Examples.Classes.Person, APP_CODE.UN7RSKVH, version=0.0.0.0, Culture=neutral, PublicKeyToken =null ';
}

Person.prototype.get_FullName = function () {
return this. FirstName + "" + this. Familyname;
}

Person.prototype.toJSON = function () {
var o = new Object ();

O.firstname = this. FirstName;
O.familyname = this. Familyname;
O.age = this. Age;
O.id = this.id;

return Ajaxpro.tojson (o);
}

Person.prototype.save = function () {
Return Person.save (this);
}

Person.save = function (p) {
var ps = new Personsaver ();
Return Ps.saveperson (P); Synchronous call
}

var personsaver = Class.create ();
Personsaver.prototype = (new Ajaxpro.request ()). Extend ({
Saveperson:function (p) {
Return This.invoke ("Saveperson", {"P":p}). value;
},
Initialize:function () {
This.url = "Ajaxpro/ajaxdemo.examples.classes.person, APP_CODE.UN7RSKVH, version=0.0.0.0, Culture=neutral, Publickeytoken=null.ashx ";
}
})

Because there are four ashx files on the top of our
function Dotest ()
{
AJAXDemo.Examples.Test.TestMethod.GetTest ("Ajaxpro", dotest_callback);
}
To execute asynchronously, and how these ashx files are generated on the page, thanks to the Web.config configuration and the following code:
Utility.registertypeforajax (typeof (AJAXDemo.Examples.Test.TestMethod));

As for the sequence of actions produced by the Utility.registertypeforajax method, I will continue to explain in the following article that interested in being able to track the execution of the code themselves.



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: info-contact@alibabacloud.com 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.