A simple method of using jquery to call asp.net backstage directly _jquery

Using jquery's $.ajax () makes it easy to invoke the ASP.net background method.

[WebMethod] Namespace

1, no parameter method call, Note: 1. Method must be static method, and must have [WebMethod] declaration

Background <c#>:

Using System.Web.Script.Services; 
 
[WebMethod] 
public static string SayHello () 
{return 
   "Hello
 ajax!"; 
}

Front desk <jQuery:

$ (function ()
 {  
  $ (' #btnOK '). Click (function ()
 {  
    $.ajax ({ 
      ///To Post method 
      type:
) Post ", 
      //method on the page and method name 
      URL:
" Data.aspx/sayhello ", 
      contentType:
" Application/json;
 " Charset=utf-8 ", 
      DataType:
" JSON ", 
      success:
function (data)
 {  
        //returned to fetch content with DATA.D 
        alert (DATA.D); 
      }, 
      Error:
function (Err)
 {  
        alert (err); 
      } 
    ); 
 
    Disable the commit of the button return 
    false;} 
);

2. Method calls with parameters

Background <c#>:

Using System.Web.Script.Services;
 
[WebMethod]
public static string Getstr (String str,
string str2)
{return
  str
 + str2;
}

Front desk <jquery>:

$ (function ()
 {  
  $ ("#btnOK"). Click (function ()
 {  
    $.ajax ({ 
      type:
Post), 
      URL:
"Data.aspx/getstr", 
      //method of writing must be to, STR is the name of the formal parameter, STR2 is the name of the second formal parameter 
      data:
"{' str ': ' I am ', ' str2 ': ' XXX '" } ", 
      ContentType:
" Application/json;
 Charset=utf-8 ", 
      DataType:
" JSON ", 
      success:
function (data)
 {  
        //returned to fetch content with DATA.D 
         alert (DATA.D); 
      }, 
      Error:
function (Err)
 {  
        alert (err); 
      } 
    ); 
 
    Disable the commit of the button return 
    false;} 
);

3, return the array method call

Background <c#>:

Using System.Web.Script.Services;
 
[WebMethod]
public static list<string>
 GetArray ()
{
  list<string>
 li = new list<string> ();
 
  for (int i
 = 0; i < i++)
    Li. ADD (i
 + "");
 
  return li;
}

Front desk <jquery>:

$ (function () {$ ("#btnOK"). Click (function () {$.ajax ({type: Post), url: "Data.aspx/getarray",
 ContentType: "Application/json; Charset=utf-8 ", DataType:" JSON ", success:function (data) {///before inserting the UL $ (" #list "). HTML (" 
 
        ");
Recursively gets the data $ (DATA.D). each (function () {//insert result into Li $ ("#list"). Append ("<li>" + This + 
        "</li>"); 
 
        }); 
      alert (DATA.D); 
      Error:function (ERR) {alert (ERR); 
 
    } 
    }); 
  Disables the submit return false for the button; 
});
});
      <reference path= "Jquery-1.4.2-vsdoc.js"/> $ (function () {$ ("#btnOK"). Click (function () {$.ajax ({
 Type: "Post", url: "Data.aspx/getarray", ContentType: "Application/json;"
 
        Charset=utf-8 ", DataType:" JSON ", success:function (data) {//before inserting the UL $ (" #list "). HTML (" ");
         Recursively gets the data $ (DATA.D). each (function () { Insert results into Li $ ("#list"). Append ("<li>" + This + "</li>");
 
        });
      alert (DATA.D);
      Error:function (ERR) {alert (ERR);
 
    }
    });
  Disables the submit return false for the button;
}); });

4, return the call to the Hashtable method

Background <c#>:

Using System.Web.Script.Services;
Using System.Collections;
 
[WebMethod]
public static Hashtable
 Gethash (string key,string value)
{
  Hashtable
 hs = new Hashtable ();
 
  Hs. ADD ("www",
"yahooooooo");
  Hs. ADD (key,
 value);
   
  return HS;
}

Front desk <jquery>:

$ (function ()
 {  
  $ ("#btnOK"). Click (function ()
 {  
    $.ajax ({ 
      type:
"Post", 
      URL:
" Data.aspx/gethash ", 
      //Remember to add double quotes
 t_t  
      data:
" {
 ' key ': ' Haha ', ' value ': ' Haha! '} ', 
      contentType:
"Application/json;
 Charset=utf-8 ", 
      DataType:
" JSON ", 
      success:
function (data)
 {  
        alert (" Key:
 Haha ==> "+data.d[" haha "]+" \ n
 key:www ==> "+data.d[" www "); 
      }, 
      Error:
function (ERR)
 {  
        alert (Err
 + ' err '); 
      } 
    }); 
 
    Disable the commit of the button return 
    false;} 
);

5. Manipulating XML

Xmltest.xml:
 
View
 plaincopy to Clipboardprint?
<?xml version= "1.0"
 encoding= "Utf-8"?> 
<data>
<item>
  <id>1</id>
  <name>qwe</name>
</item>
<item>
  <id>2</id>
  < name>asd</name>
</item>
</data>
<?xml version= "1.0"
 encoding= "Utf-8" "?>
<data>
<item>
  <id>1</id>
  <name>qwe</name>
</item>
<item>
  <id>2</id>
  <name>asd</name>
</item >
</data>

Front desk <jquery>:

$ (function ()
 {  
  $ ("#btnOK"). Click (function ()
 {  
    $.ajax ({ 
      URL:
"Xmltest.xml", 
      DataType:
' xml ',
//return type is XML
 , and the preceding JSON is not the same  
      success:
function (XML)
 {  
        //Empty list 
        $ ("#list"). HTML (""); 
        Finds XML element
        $ (XML). Find (' Data>item '). each (function ()
 {  
          $ ("#list"). Append ("<li>id:" +
 $ (this). FIND ("id"). Text ()
 + "</li>"); 
          $ ("#list"). Append ("<li>name:" +
 $ (this). Find ("Name"). Text ()
 + "</li>"); 
        } 
      }, 
      Error:
function (result,
 status) {//If no above catch error will execute the callback function 
        alert (status); 
      } 
    ); 
 
    Disable the commit of the button return 
    false;} 
);

The above is a small series for everyone to use jquery direct call asp.net backstage simple method All content, hope that we support cloud Habitat Community ~