Json introduction:
JSON (JavaScript Object Notation) is a lightweight data exchange format. Easy to read and write.
Json Official WebsiteHttp://www.json.org/
Json.netHttp://json.codeplex.com/releases/view/37810
Demo:
Description:
Click the get button to retrieve json data on the request page and fill it in the table.
Html code:
Copy codeThe Code is as follows:
<! DOCTYPE html PUBLIC "-// W3C // dtd xhtml 1.0 Transitional // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<Html xmlns = "http://www.w3.org/1999/xhtml">
<Head runat = "server">
<Title> </title>
<Script type = "text/jscript" src = "../jquery/jquery-1.4.2.min.js"> </script>
<Script language = "javascript" type = "text/javascript">
$ (Function (){
$ ("# Button1"). click (function (){
$. Get ("json1.aspx? M = m ", null, function (callbackmsg ){
Var product = eval (callbackmsg );
ShowProduct (product)
})
});
})
Function ShowProduct (callbackmsg ){
Var row = '';
For (var u in callbackmsg ){
Var len = callbackmsg [u]. length;
Row + = '<tr> ';
Row + = '<td>' + callbackmsg [u]. Name + '</td> ';
Row + = '<td>' + callbackmsg [u]. Price + '</a> </td> ';
Row + = '<td>' + callbackmsg [u]. Size + '</td> ';
Row + = '</tr> ';
}
$ ("# Body" rows .html (row );
}
</Script>
</Head>
<Body>
<Form id = "form1" runat = "server">
<Div>
<Input id = "Button1" type = "button" value = "get"/>
</Div>
<Table>
<Thead>
<Tr>
<Th>
Name
</Th>
<Th>
Price
</Th>
<Th>
Size
</Th>
</Tr>
</Thead>
<Tbody id = "body">
</Tbody>
</Table>
</Form>
</Body>
</Html>
Background code:
Copy codeThe Code is as follows:
Public partial class json1: System. Web. UI. Page
{
Protected void Page_Load (object sender, EventArgs e)
{
If (HttpContext. Current. Request. QueryString ["m"]! = Null)
{
List <Product> Products = new List <Product> ();
Products. Add (new Product () {Name = "Notebook", Price = "4.2", Size = "30x50 "});
Products. Add (new Product () {Name = "ruler", Price = "1.2", Size = "30x50 "});
Products. Add (new Product () {Name = "", Price = "36", Size = "30x50 "});
Products. Add (new Product () {Name = "pen", Price = "6.0", Size = "30x50 "});
Products. Add (new Product () {Name = "pencil", Price = "2.2", Size = "30x50 "});
String json = JsonConvert. SerializeObject (Products );
Response. Write (json );
Response. End ();
}
}
}
Public class Product
{
Public string Name {get; set ;}
Public string Size {get; set ;}
Public string Price {get; set ;}
}
Knowledge point:
1. json officially provides the dll class library for. net operations. JsonConvert. SerializeObject serializes. net objects into json.
2. Javascript reads the json object var product = eval (callbackmsg ).
3. Javascript reads the json value callbackmsg [u]. Name.