JQuery wypełnienie DropDownList z danymi JSON

Question

Powiedzmy mam dane zwracane z warstwy usług backend:

[ „2”, „3”, „7”, „14”]

pierwsze pytanie. Czy jest to uważane za prawidłowe dane JSON? Json.org mówi, że jest, ale nie mogę znaleźć żadnych odniesień do niego w Google, SO, itd ...

Zamówiona lista wartości. W większości języków jest to realizowane jako tablica, wektor, lista lub sekwencja.

Chcę móc pobrać te wartości i dodać je do już istniejącego obiektu DropDownList OnLoad przy użyciu JQuery.

$.getJSON(“http://www.example.com/path-to-get-data”, function(data) { 
    //iterate through each object and add it to the list. 
    //ideally, the key and value (string to display to the end user) would be the same. 
}); 

I przyjrzał się this thread, ale ma obiektów, a nie tylko tablicę. Czy powinienem używać parseJSON versus getJSON?

Z góry dziękuję!

Answer 1

var arr = [ 2, 3, 7, 14]; 
$.each(arr, function(index, value) { 
    ('#myselect').append($('<option>').text(value).attr('value', index)); 
}); 

Proszę również spojrzeć na rozwiązania Mr. C za:

$('<option></option>').val(item).html(item) 

Jego sposób manipulowania option S jest dla mnie nowe i bardziej elegancki.

Answer 2

To nie jest prawidłowy JSON, to musi być ten styl:

{"0": "2", "1" : "3", "2" : "7", "3" : "14"} 

Można wykorzystać te próbki do procceed Ci odpowiedzi:

var response = "[2, 3, 7, 14]"; 
eval("var tmp = " + response); 
console.log(tmp); 

Answer 3

Moje rozwiązanie oparto off Blaise's pomysłu.

//populate the Drop Down List 
$.getJSON("http://www.example.com/api/service", function (data) { 
    $.each(data, function (index, item) { 
     $('#dropDownList').append(
       $('<option></option>').val(item).html(item) 
     ); 
    }); 
}); 

Answer 4

Jest to deklaracja HiddenField, która jest przydatna do przechowywania JSON String

<asp:HiddenField ID="hdnBankStatus" runat="server" /> 

Jest to deklaracja DropdownList

<select id="optStatus" name="optStatus" runat="server"> 
     </select> 

te linie będą zainicjować wartości Hiddenfield z listy posortowanej (Załóżmy, że lista zawiera pary wartości kluczy w posortowanej kolejności), która jest następnie serializowana przy użyciu serializatora JSON

sl = new SortedList(); 
    hdnBankStatus.Value = jsonSerialiser.Serialize(sl); 

Te linie będą używać elementów String JSON jeden po drugim i wypełniają listę wartościami.

$(document).ready(function() { 

    var myOptions = $.parseJSON($('#hdnBankStatus').val()); 
     var mySelect = $('#optStatus'); 
     $.each(myOptions, function (val, text) { 
      mySelect.append(
    $('<option></option>').val(text).html(val) 
     ); 
     }); 
    } 

Answer 5

Dla mnie ten zadziałał.

$("#ddlCaseType").append("<option>" + txt + "</option>"); 

Answer 6

var arr = [ 2, 3, 7, 14]; 
var dropdown = ('#myselect'); 
dropdown.empty(); 
dropdown.append($('<option value=''>--Please Select--</option>')); 
$.each(arr, function(index, value) { 
dropdown.append($('<option value='+index+'>'+value+'</option>')); 
});`