프론트 및 backend_javascript 기술에서 데이터 전송을 위해 json을 사용하는 방법 소개-JS 튜토리얼-php.cn

이전 블로그에서는 javascript를 사용하여 여러 텍스트 그룹 을 생성하는 방법에 대해 썼는데, 이는 데이터 입력이 표시되는 것을 방지할 수 있습니다. 이제 이러한 입력을 데이터베이스에 작성해야 하며 여기서는 json을 사용하여 전달합니다. 그 안에.

먼저 전송할 데이터가 배경에서 어떻게 생성되는지 적어보겠습니다
[html]

코드 복사 코드는 다음과 같습니다.

 
function generateDtb() { 
//Write
var txtName = document.getElementById("txtName").value 
// 배열 생성
var dtb = new Array(); 
//루프를 통해 배열에 데이터를 쓰고 
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; push( row); 
} 
return dtb; 
} 
function generateDtb() { 
//Write
var txtName = document.getElementById("txtName").value; 
//배열 생성 
var dtb = new Array(); 
//루프를 통해 배열에 데이터를 쓰고 
를 반환합니다(var i = 0; i < firstGroup.length ; i ) { 
var row = new Object(); 
row.Name = txtName; 
row.fullMoney = firstGroup[i].value; value; 
dtb.push(row); 
} 
return dtb;} 

 
배열을 json 문자열로 변환하여 배경에 전달합니다. 🎜>[html] 

코드 복사

코드는 다음과 같습니다. $(함수 ( ) { //botton1 클릭

$("#lbtnOK").click(function () {

var url = "DiscountManger.aspx?ajax=1"; 
var dtb = generateDtb( ); 
// var strName = document.getElementById("txtName").value; 
if (dtb == null) 
{ } 
else { 
//직렬화된 개체
var postdata = JSON.stringify (dtb); 
//비동기 요청
$.post(url, { json: postdata }, function (json) { 
if (json) { 
jBox .tip("성공적으로 추가되었습니다! ", "tip"); 
location.reload(); 
} 
else { 
jBox.tip("추가 실패!", "tip"); 
location.reload( ); 
} 
}, "json") 
} 
}) 
}) 
$(function () { 
//botton1 클릭 
 $("#lbtnOK").click(function () { 
var url = "DiscountManger.aspx?ajax=1"; 
var dtb = generateDtb(); 
// var strName = document. getElementById("txtName").value; 
if (dtb == null) 
{ } 
else { 
//직렬화된 객체
var postdata = JSON.stringify(dtb); 🎜>//비동기 요청
$.post(url, { json: postdata }, function (json) { 
if (json) { 
jBox.tip("성공적으로 추가되었습니다!", "Tip " ); 
location.reload(); 
} 
else { 
jBox.tip("추가 실패!", "Tip") 
location.reload(); } 
}, "json") 
} 
}); 
}) 

 
백그라운드 작업: 
먼저 데이터가 필요한지 여부를 결정합니다. 전송됨 
[html] 

코드 복사

코드는 다음과 같습니다. if ( !IsPostBack) { //비동기 요청 여부 결정if (Request.QueryString["ajax"] == "1")

{

ProcessRequest() 
 } 
if (!IsPostBack) 
{ 
//비동기 요청 여부 결정
if (Request.QueryString["ajax"] == "1") 
{ 
ProcessRequest () 
 } 

 
여기에서 데이터를 처리하세요: 
[html] 

코드 복사

코드는 다음과 같습니다.

 
///  
/// 비동기 요청 처리
///  
private void ProcessRequest() 
{ 
// 채울 전략 입금
ArrayList arrDiscount = new ArrayList(); 
Response.ContentType = "text/html"; 
string json = Request.Form["json"] 
/ / DataTable 역직렬화 
if (json == null) 
{ 
return; 
} 
else 
{ 
DataTable newdtb = Json2Dtb(json); int i = 0; i < newdtb.Rows.Count; i ) 
{ 
Entity.StrategyDiscount enStrategyDiscount = new Entity.StrategyDiscount() 
//할인 계획 이름
enStrategyDiscount.name = newdtb.Rows[i]["Name"].ToString(); 
//상점 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()) 
/ / 배열에 데이터 쓰기
arrDiscount.Add(enStrategyDiscount); 
//데이터베이스에 데이터 쓰기
IStrategyBLL strategy = new StrategyBLL() 
if (strategy.AddStrategyDiscount( arrDiscount) )) 
{ 
Response.Write("true"); 
Response.End() 
} 
else 
{ 
Response.Write("false") ; 
Response.End(); 
} 
} 
/// 
/// 비동기 요청 처리
/// 
private void ProcessRequest() 
{ 
//채울 정책 저장
ArrayList arrDiscount = new ArrayList() 
Response.ContentType = "text/html" 
string json = Request.Form["json"]; 
//DataTable 역직렬화 
if (json == null) 
{ 
return; 
} 
else 
 { 
DataTable newdtb = Json2Dtb(json); 
for (int i = 0; i < newdtb.Rows.Count; i ) 
{ 
Entity.StrategyDiscount enStrategyDiscount = new Entity.StrategyDiscount( ); 
//할인 계획 이름
enStrategyDiscount.name = newdtb.Rows[i]["Name"].ToString() 
//스토어 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()); 
//배열에 데이터 쓰기
arrDiscount.Add(enStrategyDiscount) 
} 
//데이터베이스에 데이터 쓰기
IStrategyBLL 전략 = new StrategyBLL(); 
if (strategy.AddStrategyDiscount(arrDiscount)) 
{ 
Response.Write("true") 
Response.End(); 
else 
{ 
Response.Write("false"); 
Response.End() 
} 
} 

 
여기에 json Convert를 넣어야 합니다. 데이터 테이블로 
[html] 

코드 복사 코드는 다음과 같습니다. / //

/// Json을 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(drow.Keys의 문자열 키) 
{ 
dtb.Columns.Add(key, drow[key].GetType () ); 
} 
} 
DataRow row = dtb.NewRow(); 
foreach(drow.Keys의 문자열 키) 
{ 
row[key] = drow[ key] 
} 
dtb.Rows.Add(row) 
} 
} 
return dtb; // / Json을 DataTable로 
///  
/// private DataTable Json2Dtb(string json) 
{ 
JavaScriptSerializer jss = new JavaScriptSerializer(); 
ArrayList dic = jss.Deserialize(json); new DataTable(); 
if (dic.Count > 0) 
{ 
foreach (Dictionary drow in dic) 
{ 
if (dtb.Columns.Count == 0) 
{ 
foreach(drow.Keys의 문자열 키) 
{ 
dtb.Columns.Add(key, drow[key].GetType()) 
} 
 } 
DataRow row = dtb.NewRow(); 
foreach(drow.Keys의 문자열 키) 
{ 
row[key] = drow[key]} 
dtb .Rows.Add(row); 
} 
} 
return dtb; 
} 

 
이런 방식으로 데이터를 데이터베이스에 쓸 수 있습니다. 상쾌하다. 
물론, 데이터베이스에서 읽은 데이터테이블이 json을 통해 포그라운드에 표시된다면 어떨까요? 
먼저 데이터 테이블을 json 데이터로 변환해야 합니다
[html] 




코드 복사

코드는 다음과 같습니다. 다음은:

 
/// <요약> 
/// DataTable转Json 
///  
///  
/// <반품> 
비공개 문자열 Dtb2Json(DataTable dtb) 
{ 
JavaScriptSerializer jss = new JavaScriptSerializer(); 
ArrayList dic = new ArrayList(); 
foreach(dtb.Rows의 DataRow 행) 
{ 
Dictionary drow = new Dictionary(); 
foreach(dtb.Columns의 DataColumn col) 
{ 
drow.Add(col.ColumnName, row[col.ColumnName]); 
} 
dic.Add(drow); 
} 
return jss.Serialize(dic); 
} 
/// <요약> 
/// DataTable转Json 
///  
///  
/// <반품> 
비공개 문자열 Dtb2Json(DataTable dtb) 
{ 
JavaScriptSerializer jss = new JavaScriptSerializer(); 
ArrayList dic = new ArrayList(); 
foreach(dtb.Rows의 DataRow 행) 
{ 
Dictionary drow = new Dictionary(); 
foreach(dtb.Columns의 DataColumn col) 
{ 
drow.Add(col.ColumnName, row[col.ColumnName]); 
} 
dic.Add(drow); 
} 
return jss.Serialize(dic); 
} 

然后写回到前台
[html]

复主代码代码如下:

 
///  
/// 处理异步请求 
///  
private void ProcessRequest() 
{ 
Response.ContentType = "text/html"; 
string json = Request.Form["json"]; 
//反序列化DataTable 
DataTable newdtb = Json2Dtb(json); 
//序列化DataTable为JSON 
string back = Dtb2Json(newdtb); 
응답.쓰기(뒤로); 
응답.끝(); 
} 
/// <요약> 
/// 处理异步请求 
///  
private void ProcessRequest() 
{ 
Response.ContentType = "text/html"; 
string json = Request.Form["json"]; 
//反序列化DataTable 
DataTable newdtb = Json2Dtb(json); 
//序列化DataTable为JSON 
string back = Dtb2Json(newdtb); 
응답.쓰기(뒤로); 
응답.끝(); 
} 

지금前台接受显示：
[html]

复主代码代码如下:

 
$(function() { 
//点击botton1 
$("#botton1").click(function() { 
createTable(json); 
}); 
}); 
//显示Json中的数据 
function createTable(json) { 
var table = $(""); 
for (var i = 0; i o1 = json[i]; 
var row = $(""); 
for (o1 입력) { 
var td = $(""); 
td.text(o1[key].toString()); 
td.appendTo(행); 
} 
row.appendTo(테이블); 
} 
table.appendTo($("#back")); 
} 
$(function() { 
//点击botton1 
$("#botton1").click(function() { 
createTable(json); 
}) ; 
}); 
//显示Json中的数据 
function createTable(json) { 
var table = $(""); 
for (var i = 0; i o1 = json[i]; 
var row = $(""); 
for (o1 입력) { 
var td = $(""); 
td.text(o1[key].toString()); 
td.appendTo(행); 
} 
row.appendTo(테이블); 
} 
table.appendTo($("#back")); 
} 