MVC控制器返回JSON來填充選擇列表，但值需要冒號

我們有一個MVC控制器返回JSON，這是我們想要的。
然後，我們使用選項來填充選擇列表，其中的值具有冒號。 JSON： {結果：{[ 「ValueOne」：「選項1：我的選擇」，「ValueTwo」：「選項2：其它選項」]}MVC控制器返回JSON來填充選擇列表，但值需要冒號

我們用jQuery從$就填充列表

$("#EventNameDropdownList").change(function() { 
        GetEventDatesAndTimes(); 
       }) 

      function GetEventDatesAndTimes() { 
       var eventName = $('#EventNameDropdownList').val();// On get from EventNameDropdownList the value is coming back as "Option 1:" instead of the whole value. 

       var url = '@Url.Action("GetEventDateTimeByName", "Product")'; 
       $("#EventIdAndDateDropdownList").find('option').remove().end(); // clear before appending new list 
       $.ajax({ 
        url: url, 
        type: "GET", 
        cache: false, 
        dataType: "json", 
        data: { eventName: eventName }, 
        success: function (data) { 
         console.log("Success"); 
         if (data.eventDateTimeList.length) { 
          $.each(data.eventDateTimeList, function (i, event) { 
           console.log("ForEach: " + event.EventName); 
           $("#EventIdAndDateDropdownList").append("<option value=" + event.StartDateTime + ">" + event.StartDateTime + "</option>") 
          }); 
         } else { 
          $("#EventIdAndDateDropdownList").find('option').remove().end(); // clear before appending new list 

          console.log("result NO data"); 

         } 

        }, 
        error: function() { 
         $("#EventIdAndDateDropdownList").find('option').remove().end(); // clear list 
         alert("An error occurred getting the Event Names"); 
        } 
       }); 
      }

這是工作，填充選項列表罰款。

例子我希望發生的事情：

<select> 
    <option value="Option 1: My Option">Option 1: My Option</option> 
    <option value="Option 2: My Option">Option 2: Other Option</option> 
</select>

但實際上什麼出來

<select> 
    <option value="Option 1:" My Option>Option 1: My Option</option> 
    <option value="Option 2:" My Option>Option 2: Other Option</option> 
</select>

正如你可以在選項值屬性的冒號後面的字符串終止看到，所以從整個價值帶冒號的JSON字符串不會被引號包圍。

來源

2016-06-10 ClosDesign

可以逃脫結腸？ –

簡單的串連把它發送到前端使用前'像

'<option value="' + event.StartDateTime + '">' + event.StartDateTime + '</option>'

來源

2016-06-10 21:42:05 Tushar

當你看了太長時間後，總會找到簡單的答案。謝謝，那就是它。字符串建設問題。 – ClosDesign

-1

你能否提供實際上創建DOM元素的javascript？我想你是從JSON插入值，然後將其寫入DOM，是這樣的：

options.each(function(){ 
    var option = "<option " + this + ">" + this + "</option>"; 
    // append the option into select 
})

更新： @ClosDesign有正確的答案。

來源

2016-06-10 21:16:53

更新了jQuery的問題。希望這可以幫助 – ClosDesign

你能幫我一個忙嗎，如果你做typeof event.StartDateTime，你會得到什麼？我猜這不是一個字符串。 –

感謝您的建議。我是StackOverflow的新手，所以我在這裏學習範例，並獲得特權。我其實剛剛解鎖了留言的能力（50代表），所以下次我會這樣做。再次感謝。 –

MVC控制器返回JSON來填充選擇列表，但值需要冒號

回答

相關問題