2016-06-08 122 views
0

這是我的第一個數據綁定通過AJAX HTML控件嘗試。我檢查/調試我的ajax調用和數據檢索確定,但沒有出現在選擇選項。我的JavaScript位於我的aspx頁面的底部。有什麼問題選擇選項不顯示數據

$(function() { 
      $.ajax({ 
       type: "POST", 
       url: "psHlp.asmx/getDistricts", 
       data: "{}", 
       contentType: "application/json; charset=utf-8", 
       dataType: "json", 
       success: function (msg) { 
        $("#District").empty(); 

        $.each(msg.d, function() { 
         $("#District").append($("<option></option>").val(this['Value']).html(this['Text'])); 
        }); 


       }, 
       error: function() { 
        alert("Failed to load districts"); 
       } 
      }); 
     }); 

這是位於在我的網頁開始我選擇選項

<div class="col-sm-3 col-xs-12 ffield"> 
             <select id="District" style="display: none;"> 

             </select> 
            </div> 

回答

0

最後我找到了解決方案。以上所有建議都是正確的。發生此問題是因爲我使用bootstarp JS/CSS(客戶的設計師提供的設計),所以我需要重建追加後的多選選項。

var options = ""; 
    $.each(response.d, function() { 

     options += '<option value="' + this['Value'] + '">' + this['Text'] + '</option>'; 
    }); 
    $("#Town").append().html(options); 

    $("#Town").multiselect('rebuild'); 

希望這將幫助至少一人:)

0

您需要在您的$.each回調函數指定(index,value) PARAMS和使用value訪問迭代元素。像這樣的東西。

$.each(msg.d, function (index,value) { 
    $("#District").append("<option value='" + value.Value + "'>" + value.Text + "</option>"); 
}); 
+0

感謝,但沒有奏效。我在循環顯示值['value']中添加一個警告函數,並正確顯示所有行。發生了什麼?????? –

+0

請嘗試更新的答案,看看它是否有效。 – phreakv6

+0

你能設置一個小提琴或給我的完整網址Ajax調用? ' 「psHlp.asmx/getDistricts」' – phreakv6

0

請嘗試在每個循環中使用像這樣。

var options; 
$.each(msg.d, function() { 
options += '<option value="' + this["Value"] + '">' + this["Text"] + '</option>'; 
}); 
console.log(options); 
$("#District").append(options); 
+0

是@ phreakv6也是正確的,你可以傳遞參數在上面代碼中的函數中,使用value可以加載這個值。 – Samir

+0

我也試過你的建議,但是值不在選擇選項中填充。此日誌消息<選項值= 「1」> XXX<選項值= 「3」> ZZZZ<選項值= 「4」> DDD<選項值= 「10」> vvvvl<選項值=「6 「> mmm。正如你所看到的值填充,但沒有出現在選擇選項。有些東西阻止它綁定 –

+0

@Maria h,所以你在你的循環中獲得正確的HTML結構。所以請嘗試一次使用像這樣'$(「select#District」)。html(options); 」。希望這會對你有用。 – Samir