JQuery将DataTable数据转换成JSON数据

JQuery将DataTable数据转换成JSON数据

动态创建表格显示数据
一般处理程序JsonDate.ashx

public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/plain";
DataTable data2 = myData();

string str = DataTableToJson("myJson", data2);//构建的json数据

context.Response.Write(str);
}

public bool IsReusable
{
get
{
return false;
}
}


//用datatable做数据,数据模拟
public DataTable myData()
{
DataTable dt = new DataTable();
DataColumn dc;
DataRow dr;

dc = new DataColumn("Name", System.Type.GetType("System.String"));
dt.Columns.Add(dc);
dc = new DataColumn("Email", System.Type.GetType("System.String"));
dt.Columns.Add(dc);
dc = new DataColumn("Phon", System.Type.GetType("System.String"));
dt.Columns.Add(dc);
dc = new DataColumn("Move", System.Type.GetType("System.String"));
dt.Columns.Add(dc);
dc = new DataColumn("Pan", System.Type.GetType("System.String"));
dt.Columns.Add(dc);
dc = new DataColumn("select", System.Type.GetType("System.String"));
dt.Columns.Add(dc);
for (int i = 1; i < 7; i++)
{
dr = dt.NewRow();
dr["Name"] = "Name" + i.ToString();
dr["Email"] = "Email" + i.ToString();
dr["Phon"] = "Phon" + i.ToString();
dr["Move"] = "Move" + i.ToString();
dr["Pan"] = "Pan" + i.ToString();
dr["select"] = i.ToString();
dt.Rows.Add(dr);
}

int count = dt.Rows.Count;
return dt;
}

//将datatable数据转换成JSON数据
public string DataTableToJson(string jsonName, DataTable dt)
{
StringBuilder Json = new StringBuilder();
Json.Append("[");
if (dt.Rows.Count > 0)
{
for (int i = 0; i < dt.Rows.Count; i++)
{
Json.Append("{");
for (int j = 0; j < dt.Columns.Count; j++)
{
Json.Append(dt.Columns[j].ColumnName.ToString() + ":\"" + dt.Rows[i][j].ToString() + "\"");
if (j < dt.Columns.Count - 1)
{
Json.Append(",");
}
}
Json.Append("}");
if (i < dt.Rows.Count - 1)
{
Json.Append(",");
}
}
}
Json.Append("]");
return Json.ToString();
}

//列表数据转换到json数据
public string ObjectToJson<T>(string jsonName, IList<T> IL)
{
StringBuilder Json = new StringBuilder();
Json.Append("[");
if (IL.Count > 0)
{
for (int i = 0; i < IL.Count; i++)
{
T obj = Activator.CreateInstance<T>();
Type type = obj.GetType();
PropertyInfo[] pis = type.GetProperties();
Json.Append("{");
for (int j = 0; j < pis.Length; j++)
{
Json.Append(pis[j].Name.ToString() + ":\"" + pis[j].GetValue(IL[i], null) + "\"");
if (j < pis.Length - 1)
{
Json.Append(",");
}
}
Json.Append("}");
if (i < IL.Count - 1)
{
Json.Append(",");
}
}
}
Json.Append("]");
return Json.ToString();
}

页面Default.aspx



function GetData()
{
$.getJSON(
"JsonData.ashx",//产生Json数据的服务端页面
function(json)
{
for(var i=0;i<json.length;i++)
{
//开始
var index=-1;
var txtTRLastIndex = findObj("txtTRLastIndex",document);
var rowID = parseInt(txtTRLastIndex.value);
var signFrame = findObj("SignFrame",document);
//添加行
var newTR = signFrame.insertRow(signFrame.rows.length);
newTR.id = "SignItem" + rowID;
//添加列:序号
var newNameTD=newTR.insertCell(0);
//添加列内容
newNameTD.innerHTML = newTR.rowIndex.toString();
//添加列:姓名
var newNameTD=newTR.insertCell(1);
//添加列内容
newNameTD.innerHTML = "<input name='txtName" + rowID + "' id='txtName" + rowID + "' value='"+json[i].Name+"' type='text' size='12' />";
//添加列:电子邮箱
var newEmailTD=newTR.insertCell(2);
//添加列内容
newEmailTD.innerHTML = "<input name='txtEMail" + rowID + "' id='txtEmail" + rowID + "' value='"+json[i].Email+"' type='text' size='20' />";
//添加列:电话
var newTelTD=newTR.insertCell(3);
//添加列内容
newTelTD.innerHTML = "<input name='txtTel" + rowID + "' id='txtTel" + rowID + "' value='"+json[i].Phon+"' type='text' size='10' />";
//添加列:手机
var newMobileTD=newTR.insertCell(4);
//添加列内容
newMobileTD.innerHTML = "<input name='txtMobile" + rowID + "' id='txtMobile" + rowID + "' value='"+json[i].Move+"' type='text' size='12' />";
//添加列:公司名
var newCompanyTD=newTR.insertCell(5);
//添加列内容
newCompanyTD.innerHTML = "<input name='txtCompany" + rowID + "' id='txtCompany" + rowID + "' value='"+json[i].Pan+"' type='text' size='20' />";

//添加下拉框
var newCompanyTD=newTR.insertCell(6);
newCompanyTD.innerHTML = "<select id='Select"+rowID+"'><option value='1'>1</option><option value='2'>2</option><option value='3'>3</option><option value='4'>4</option><option value='5'>5</option> </select>";

//动态选中下拉框
for(var j=0;j<document.getElementById("Select"+rowID).options.length;j++)
{
if(document.getElementById("Select"+rowID).options[j].text==json[i].select)
index=j;
}
if(index>=0)
document.getElementById("Select"+rowID).options[index].selected=true;


//添加列:删除按钮
var newDeleteTD=newTR.insertCell(7);
//添加列内容
newDeleteTD.innerHTML = "<div align='center' style='width:40px'><a href='javascript:;' onclick=\"DeleteSignRow('SignItem" + rowID + "')\">删除</a></div>";
//将行号推进下一行
txtTRLastIndex.value = (rowID + 1).toString();
}
}


)
}