使用jQuery綁定Ajax數據

我從我的C＃WebMethod獲取數據。我不知道如何從我的WebMethod鍵和值綁定到我的下拉：使用jQuery綁定Ajax數據

<select name="rest" id="rest" maxlength="50" style="width: 200px;"></select>

C＃

[WebMethod] 
public static Dictionary<string, string> LoadRestByCityState(string city, string state) 
{ 
     DataSet ds = new DataSet(); 
     Database db = DatabaseFactory.CreateDatabase(ConfigManager.AppSettings["ConnectionString.Data"]); 
     DbCommand dbCommand = db.GetStoredProcCommand("sel_RestByCityState_p"); 
     db.AddInParameter(dbCommand, "@pListCity", DbType.String, city); 
     db.AddInParameter(dbCommand, "@pListState", DbType.String, state); 
     ds = db.ExecuteDataSet(dbCommand); 

     Dictionary<string, string> rest = new Dictionary<string,string>(); 

     foreach (DataRow row in ds.Tables[0].Rows) 
     { 
      rest.Add(row[0].ToString(), row[1].ToString()); 
     } 
      return rest; 

}

jQuery的

function LoadRest() { 
     __state = $("#State :selected").val(); 
     __state = '"' + __state + '"' 
     __city = $("#City :selected").val(); 
     __city = '"' + __city + '"' 
     $.ajax({ 
      type: "POST", 
      url: "Default.aspx/LoadRestByCityState", 
      data: '{"city":' + __city + ',"state":'+ __state +'}', 
      contentType: "application/json; charset=utf-8", 
      dataType: "json", 
      async: true, 
      cache: false, 
      success: 
       function (data) { 
        $.each(data[0], function(key....not sure about this stuff 
        alert('parks loaded'); 
       }, 
      fail: function() { 
       alert("Error."); 
      } 
     }); 
     return false; 
    }

數據這正在傳遞給WebMethod

{ 
"state": "AL", 
"city": "Auburn" 
}

當調試我的WebMethod時，我將鼠標懸停在「休息」上，它顯示「密鑰」和「值」。

來源

2012-01-23 Trey Copeland

不要使用字典，因爲它不會序列化爲集合。使用列表：

public static List<KeyValuePair<string, string>> LoadRestByCityState(string city, string state) 
{ 
    ... 
}

然後：

success: function (data) { 
    var rest = $('#rest'); 
    rest.empty(); 
    $.each(data.d, function(index, item) { 
     rest.append(
      $('<option/>', { 
       value: item.Key, 
       text: item.Value 
      }) 
     ); 
    }); 
}

也確保送他們之前正確編碼的值。我建議你使用JSON.stringify方法，因爲如果這個城市有報價在它的名字你的要求將打破：

data: JSON.stringify({city: __city, state: __state }),

的JSON.stringify方法被內置到現代的瀏覽器，但如果你需要支持舊版瀏覽器你可以包括json2.js腳本到您的頁面。

來源

2012-01-23 17:31:05

試試這個

success : function(data){ 
    $.each(data, function(index, elem){ 
     $.each(elem, function(key,value){ 
     $('select#rest').append('<option value="'+key+'">"'+value+'"</option>'); 
     }); 
    }); 
}

更新：其他解決方案

success : function(data){ 
    $.each(data, function(index, elem){ 
      for(var key in elem){ 
      $('select#rest').append('<option value="'+key+'">"'+elem[key]+'"</option>'); 
      } 
    }); 
}

來源

2012-01-23 17:39:31

即時得到0和我的下拉[ 「目標對象」。儘管如此，仍然返回正確的JSON值。 –

好吧..我已經添加了一個解決方案..請嘗試.. –

使用jQuery綁定Ajax數據

回答

相關問題