JQueryのjson data_jquery解析の詳細説明

私は最近 jquery に悩まされており、json を解析する jquery のデモを作成しました。このデモでは、asp.net バックグラウンドから dataSet または dataTable データ セットをインスタンス化し、dataSet を json に変換してクライアントに返します。 client jquery getJson メソッドを使用して解析し、ページに表示します。

まず、getJson メソッドを簡単に紹介します

Jquery.getJson(url,[データ],[コールバック])

url: 送信リクエストのアドレス。
data: 送信されるキー/値パラメータ。
callback: ロードが成功したときのコールバック関数。

以下は実際の getJson メソッドです

まず、データセット データセットを JSON 文字列に変換するための補助クラスを作成します

コードをコピーします コードは次のとおりです:

public static string DataTableToJson(string jsonName, DataTable dt)
{
StringBuilder Json = new StringBuilder();
Json.Append("{"" jsonName "") :[ ");
if (dt.Rows.Count > 0)
{
for (int i = 0; i {
Json .Append("{");
dt.Columns[j].ColumnName.ToString() "":"" dt.Rows[i][j].ToString() """);
> json.append（ "、"）; son.append（ "}"）; return Json.ToString();
}


このメソッドは、msdn の補助クラス メソッドです。

2 番目のステップは、デモンストレーション データセットを手動で構成して作成することですが、プロジェクトでは通常、データはデータベースまたはサービスから取得されます




コードをコピー


コードは次のとおりです:

public static DataSet BindData()
{
DataTable dtData = new DataTable();
dtData.Columns.Add("id");
dtData.Columns。追加( "名前");
dtData.Columns.Add("性別");
DataRow drData;
drData = dtData.NewRow();
drData[0] = 16;
drData [1] = "zhaoliu";
drData[2] = "man";
dtData.Rows.Add(drData);
drData = dtData.NewRow();
drData[0 ] = 19;
drdata [1] = "zhangsan";
drdata [2] = "women";
dtdata.add（drdata）;
dataset ds = new Dataset（）;
ds.Tables.Add(dtData);
return ds;
}

第三步创建aspx页面

前台页面：两个ボタン，一单击开開始解析jsonデータ，另外一查看json字符串

夹制代代幣如下:

   
   
   


   

   

       

       

       

        
   

   

后台页面：

复制代码 代码如下:

 protected void Page_Load(object sender, EventArgs e)
        {
            JsonAjax();
        }
        private void JsonAjax() {
            string action = Request["Action"];
            if (!string.IsNullOrEmpty(action) && action == "action")  //判断是否通过前台的点击事件进来的
            {
                string str = DataTableConvertJson.DataTableToJson("json", Data.BindData().Tables[0]);
                Response.Write(str);
                Response.End();
            }
        }

最后给大家展示一下生成的json格式：

Top of Form

{"json":[{"id":"16","name":"zhaoliu","sex":"man"},{"id":"19","name":"zhangsan","sex":"women"}]}

Bottomof Form