How to Use json for data transmission instances in the front and backend _ javascript skills

Source: Internet
Author: User
Tags string back
These inputs need to be written to the database. Here json is used for input. Let's take a look at how the data to be transmitted is generated in the background. If you are interested, refer, I hope this will help you write the previous blog and use javascript to generate multiple groups of texts, so that data input is not displayed. Now we need to write these inputs into the database. Here we will use json to pass in.

First, let's write about how to generate the data to be transmitted in the background.
[Html]

The Code is as follows:


Function generateDtb (){
// Write
Var txtName = document. getElementById ("txtName"). value;
// Create an array
Var dtb = new Array ();
// Write data to the array in a loop and return
For (var I = 0; I <firstGroup. length; I ++ ){
Var row = new Object ();
Row. Name = txtName;
Row. fullMoney = firstGroup [I]. value;
Row. discount = secondGroup [I]. value;
Dtb. push (row );
}
Return dtb;
}
Function generateDtb (){
// Write
Var txtName = document. getElementById ("txtName"). value;
// Create an array
Var dtb = new Array ();
// Write data to the array in a loop and return
For (var I = 0; I <firstGroup. length; I ++ ){
Var row = new Object ();
Row. Name = txtName;
Row. fullMoney = firstGroup [I]. value;
Row. discount = secondGroup [I]. value;
Dtb. push (row );
}
Return dtb;
}


Convert the array into a json string and pass it to the background:
[Html]

The Code is as follows:


$ (Function (){
// Click botton1
$ ("# LbtnOK"). click (function (){
Var url = "DiscountManger. aspx? Ajax = 1 ";
Var dtb = generateDtb ();
// Var strName = document. getElementById ("txtName"). value;
If (dtb = null)
{}
Else {
// Serialize the object
Var postdata = JSON. stringify (dtb );
// Asynchronous request
$. Post (url, {json: postdata}, function (json ){
If (json ){
JBox. tip ("added successfully! "," Prompt ");
Location. reload ();
}
Else {
JBox. tip ("failed to add! "," Prompt ");
Location. reload ();
}
}, "Json ")
}
});
});
$ (Function (){
// Click botton1
$ ("# LbtnOK"). click (function (){
Var url = "DiscountManger. aspx? Ajax = 1 ";
Var dtb = generateDtb ();
// Var strName = document. getElementById ("txtName"). value;
If (dtb = null)
{}
Else {
// Serialize the object
Var postdata = JSON. stringify (dtb );
// Asynchronous request
$. Post (url, {json: postdata}, function (json ){
If (json ){
JBox. tip ("added successfully! "," Prompt ");
Location. reload ();
}
Else {
JBox. tip ("failed to add! "," Prompt ");
Location. reload ();
}
}, "Json ")
}
});
});


Operations in the background:
First, determine whether data needs to be transmitted
[Html]

The Code is as follows:


If (! IsPostBack)
{
// Determine whether the request is asynchronous
If (Request. QueryString ["ajax"] = "1 ")
{
ProcessRequest ();
}
If (! IsPostBack)
{
// Determine whether the request is asynchronous
If (Request. QueryString ["ajax"] = "1 ")
{
ProcessRequest ();
}


Process the data here:
[Html]

The Code is as follows:


///


/// Process asynchronous requests
///
Private void ProcessRequest ()
{
// Save the policy to be filled in
ArrayList arrDiscount = new ArrayList ();
Response. ContentType = "text/html ";
String json = Request. Form ["json"];
// Deserialize the able
If (json = null)
{
Return;
}
Else
{
DataTable newdtb = Json2Dtb (json );
For (int I = 0; I <newdtb. Rows. Count; I ++)
{
Entity. StrategyDiscount enStrategyDiscount = new Entity. StrategyDiscount ();
// Discount solution name
EnStrategyDiscount. name = newdtb. Rows [I] ["Name"]. ToString ();
// Store ID
EnStrategyDiscount. shopId = long. Parse (LoginInfo. ShopID );
EnStrategyDiscount. fullMoney = Convert. ToDecimal (newdtb. Rows [I] ["fullMoney"]. ToString ());
EnStrategyDiscount. discount = Convert. ToDecimal (newdtb. Rows [I] ["discount"]. ToString ());
// Write data to the array
ArrDiscount. Add (enStrategyDiscount );
}
// Write data to the database
IStrategyBLL strategy = new StrategyBLL ();
If (strategy. AddStrategyDiscount (arrDiscount ))
{
Response. Write ("true ");
Response. End ();
}
Else
{
Response. Write ("false ");
Response. End ();
}
}
///
/// Process asynchronous requests
///
Private void ProcessRequest ()
{
// Save the policy to be filled in
ArrayList arrDiscount = new ArrayList ();
Response. ContentType = "text/html ";
String json = Request. Form ["json"];
// Deserialize the able
If (json = null)
{
Return;
}
Else
{
DataTable newdtb = Json2Dtb (json );
For (int I = 0; I <newdtb. Rows. Count; I ++)
{
Entity. StrategyDiscount enStrategyDiscount = new Entity. StrategyDiscount ();
// Discount solution name
EnStrategyDiscount. name = newdtb. Rows [I] ["Name"]. ToString ();
// Store ID
EnStrategyDiscount. shopId = long. Parse (LoginInfo. ShopID );
EnStrategyDiscount. fullMoney = Convert. ToDecimal (newdtb. Rows [I] ["fullMoney"]. ToString ());
EnStrategyDiscount. discount = Convert. ToDecimal (newdtb. Rows [I] ["discount"]. ToString ());
// Write data to the array
ArrDiscount. Add (enStrategyDiscount );
}
// Write data to the database
IStrategyBLL strategy = new StrategyBLL ();
If (strategy. AddStrategyDiscount (arrDiscount ))
{
Response. Write ("true ");
Response. End ();
}
Else
{
Response. Write ("false ");
Response. End ();
}
}


Here, we need to convert json to datatable
[Html]

The Code is as follows:


///


/// Convert Json to DataTable
///
///
///
Private DataTable Json2Dtb (string json)
{
JavaScriptSerializer jss = new JavaScriptSerializer ();
ArrayList dic = jss. Deserialize (json );
DataTable dtb = new DataTable ();
If (dic. Count> 0)
{
Foreach (Dictionary Drow in dic)
{
If (dtb. Columns. Count = 0)
{
Foreach (string key in drow. Keys)
{
Dtb. Columns. Add (key, drow [key]. GetType ());
}
}
DataRow row = dtb. NewRow ();
Foreach (string key in drow. Keys)
{
Row [key] = drow [key];
}
Dtb. Rows. Add (row );
}
}
Return dtb;
}
///
/// Convert Json to DataTable
///
///
///
Private DataTable Json2Dtb (string json)
{
JavaScriptSerializer jss = new JavaScriptSerializer ();
ArrayList dic = jss. Deserialize (json );
DataTable dtb = new DataTable ();
If (dic. Count> 0)
{
Foreach (Dictionary Drow in dic)
{
If (dtb. Columns. Count = 0)
{
Foreach (string key in drow. Keys)
{
Dtb. Columns. Add (key, drow [key]. GetType ());
}
}
DataRow row = dtb. NewRow ();
Foreach (string key in drow. Keys)
{
Row [key] = drow [key];
}
Dtb. Rows. Add (row );
}
}
Return dtb;
}


In this way, you can write data to the database without any additional concerns.
Of course, if we have a datatable read from the database, what if it is displayed in front of the database in json format.
First, we need to convert the datatable to json data.
[Html]

The Code is as follows:


///


/// Convert DataTable to Json
///
///
///
Private string Dtb2Json (DataTable dtb)
{
JavaScriptSerializer jss = new JavaScriptSerializer ();
ArrayList dic = new ArrayList ();
Foreach (DataRow row in dtb. Rows)
{
Dictionary Drow = new Dictionary ();
Foreach (DataColumn col in dtb. Columns)
{
Drow. Add (col. ColumnName, row [col. ColumnName]);
}
Dic. Add (drow );
}
Return jss. Serialize (dic );
}
///
/// Convert DataTable to Json
///
///
///
Private string Dtb2Json (DataTable dtb)
{
JavaScriptSerializer jss = new JavaScriptSerializer ();
ArrayList dic = new ArrayList ();
Foreach (DataRow row in dtb. Rows)
{
Dictionary Drow = new Dictionary ();
Foreach (DataColumn col in dtb. Columns)
{
Drow. Add (col. ColumnName, row [col. ColumnName]);
}
Dic. Add (drow );
}
Return jss. Serialize (dic );
}


Then write back to the front-end
[Html]

The Code is as follows:


///


/// Process asynchronous requests
///
Private void ProcessRequest ()
{
Response. ContentType = "text/html ";
String json = Request. Form ["json"];
// Deserialize the able
DataTable newdtb = Json2Dtb (json );
// Serialize the DataTable to JSON
String back = Dtb2Json (newdtb );
Response. Write (back );
Response. End ();
}
///
/// Process asynchronous requests
///
Private void ProcessRequest ()
{
Response. ContentType = "text/html ";
String json = Request. Form ["json"];
// Deserialize the able
DataTable newdtb = Json2Dtb (json );
// Serialize the DataTable to JSON
String back = Dtb2Json (newdtb );
Response. Write (back );
Response. End ();
}


Display at reception:
[Html]

The Code is as follows:


$ (Function (){
// Click botton1
$ ("# Botton1"). click (function (){
CreateTable (json );
});
});
// Display data in Json
Function createTable (json ){
Var table = $ ("

");
For (var I = 0; I <json. length; I ++ ){
O1 = json [I];
Var row = $ ("");
For (key in o1 ){
Var td = $ ("");
Td. text (o1 [key]. toString ());
Td. appendTo (row );
}
Row. appendTo (table );
}
Table. appendTo ($ ("# back "));
}
$ (Function (){
// Click botton1
$ ("# Botton1"). click (function (){
CreateTable (json );
});
});
// Display data in Json
Function createTable (json ){
Var table = $ ("
");
For (var I = 0; I <json. length; I ++ ){
O1 = json [I];
Var row = $ ("");
For (key in o1 ){
Var td = $ ("");
Td. text (o1 [key]. toString ());
Td. appendTo (row );
}
Row. appendTo (table );
}
Table. appendTo ($ ("# back "));
}


In this way, the json data is transmitted to the background and the background data is displayed. Of course, this transmission method is only one of the transmission methods, if it is a simple string, you can also use get and post for transmission. However, javascript itself has insecure and unstable rows. For some important data, it is recommended to find some more reliable methods.
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: 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.