如何在 jquery 中读取 JSON 数据(数据集包含许多 table)以一次绑定多个下拉列表

how to read JSON data (Dataset contains many table) in jquery to bind mutiple dropdown at a time

在使用 apache cordova phonegap 开发 android 应用程序时,我想在页面加载时绑定多个下拉菜单。

我使用web API contoller方法获取数据代码如下:

  public DataSet GetDDL()    
        {
            DataSet ds = new DataSet();
            try
            {
                GetCompany user = new GetCompany();
                con = new SqlConnection(constr);
                cmd = new SqlCommand();
                cmd.Connection = con;
                cmd.CommandType = CommandType.StoredProcedure;
                cmd.CommandText = "SP_ONLINE_APPLICATION_DROPDOWN_FILL";
                 con.Open();
                da = new SqlDataAdapter(cmd);
                da.Fill(ds);
            }
            catch (Exception ex)
            {
           // lblMsg = ex.Message();
             }
            finally
            {
            con.Close();
            con.Dispose();
            }
            return ds;
        }

获取数据为

{"Table":[{"intDist_Id":664,"vc_Dist_Name":"---"},                 {"intDist_Id":14,"vc_Dist_Name":"Adilabad"},        {"intDist_Id":508,"vc_Dist_Name":"Agra"}],
"Table1":[{"intCity_Id":600,"vcCity_Name":"--"},    {"intCity_Id":503,"vcCity_Name":"Aarmori"}]}

我想阅读两个表格:填写下拉列表

Jquery 代码就像

 var uri = 'http://localhost:6584/api/ChangeOfName/Getddl';
    var testDdl1 = $('#ddDistrict');
  var testDdl2 = $('#ddCity');
   $.getJSON(uri)
    .done(function (data) {

       $.each(data, function (key, item) {
           if(key=="Table")
           {
               var option = $("<option/>");
       option.attr("value",item.intDist_Id).text(item.Disvc_Dist_NametName);
               testDdl.append(option);
           }
       })
       $.each(data, function (key, item) {
           if(key=="Table1")
           {
               var option = $("<option/>");
               option.attr("value", item.intCity_Id).text(item.vcCity_Name);
               testDdl2.append(option);
           }
       })
   }
)

但发现 'item.intDist_Id' 未定义。为什么?

Javascript 将对象视为类似于 C# 中的字典。因此 jQuery 每个循环遍历 JSON 中的 key/value 对。在这种情况下:Table 和 Table1 及其各自的数组值。该数组没有 属性 intDist_Id,因此它 returns 未定义。

您必须遍历项目数组值才能获得具有属性 intDist_Id 等的实际对象

$.each(data, function (key, items) {
  $.each(items, function(index, item) {
    if(key=="Table")
    {
      var option = $("<option/>");
      option.attr("value",item.intDist_Id).text(item.Disvc_Dist_NametName);
      testDdl.append(option);
    }
    else if(key=="Table1")
    {
      var option = $("<option/>");
      option.attr("value",item.intDist_Id).text(item.Disvc_Dist_NametName);
      testDdl.append(option);
    }
  }); 
});

你需要做这样的事情:

for (var i=0; i<data.length; i++) {
   alert("Your Results: " + data[i].pk_records_id);
  // you need to write each key name here
}