在列表框中顯示方法的結果

Question

我創建了一個WCF項目，我試圖在列表框中顯示一些信息。我想當我點擊一個按鈕時，它會調用我的方法並將其顯示在列表框中。我的方法工作正常，但我無法顯示它在我的列表框中。下面是我試圖代碼：

 $('#btnListBlob').click(function() { 
 
      $.ajax({ 
 
       type: "POST", 
 
       url: 'http://localhost:50525/BlobService.svc/ListBlob', 
 
       data: JSON.stringify(), 
 
       contentType: "application/json; charset=utf-8", 
 
       dataType: "json", 
 
       processData: true, 
 
       success: function (data) { 
 
        $(data).appendTo('#blobList') 
 
        alert('listed'); 
 
       }, 
 
       error: function (data) { 
 
        alert('Some error Occurred!'); 
 
       } 
 
      }); 
 
     });

我想顯示在我的#blobList我在URL調用該方法。

Answer 1

你可能想看看你正在追加的數據。數據應該採用以下形式：

<option value="5">item 5</option> 

記住您正在追加HTML而不是僅追加數據。

我會說一個console.log並嘗試調試從服務器接收到的數據。

$('#btnListBlob').click(function() { 
     $.ajax({ 
      type: "POST", 
      url: 'http://localhost:50525/BlobService.svc/ListBlob', 
      data: JSON.stringify(), 
      contentType: "application/json; charset=utf-8", 
      dataType: "json", 
      processData: true, 
      success: function (data) { 

的console.log（數據）

Answer 2

，你可能會發現有用的只是一些建議：

// only update the dom on click 
// also use the new on() method 
$('#btnListBlob').on("click", function() { 
    $("#blobList").html(processData()) 
}); 

// separate the call and data processing 
var serverData = {"fakeServerData":[ 
    {"data": "test data 1"}, 
    {"data": "test data 2"} 
]}; 

function processData(){ 
    var options =""; 
    for(var i = 0 ; i < serverData.fakeServerData.length ; i++){ 
     options += "<option>" + serverData.fakeServerData[i].data + "</option>"; 
    } 

    return options; 
} 

希望它能幫助，祝你好運！