jQuery Auswahlliste Optionen von JSON, geschieht nicht wie beworben?

Question

Wie kommt dies nicht funktioniert (auf eine leere Auswahlliste <select id="requestTypes"></select> Betriebs

$(function() {

        $.getJSON("/RequestX/GetRequestTypes/", showRequestTypes);

    }
    );


    function showRequestTypes(data, textStatus) {

        $.each(data,
            function() {

                var option = new Option(this.RequestTypeName, this.RequestTypeID);
                // Use Jquery to get select list element
                var dropdownList = $("#requestTypes");

                if ($.browser.msie) {
                    dropdownList.add(option);
                }

                else {

                    dropdownList.add(option, null);

                }
            }
            );

        }

Aber das tut:

• Ersetzen Sie:

  var dropdownList = $("#requestTypes");

• Mit plain old javascript:

  var dropdownList = document.getElementById("requestTypes");

Answer 1

$("#requestTypes") gibt ein jQuery-Objekt, das alle ausgewählten Elemente enthält. Sie versuchen, die add() Methode eines einzelnen Elements zu nennen, sondern Sie die add() Methode des jQuery-Objekt aufrufen, die etwas ganz anderes tut.

Um das DOM-Element selbst zugreifen zu können, müssen Sie das jQuery-Objekt als Array zu behandeln und das erste Element aus ihm heraus, durch $("#requestTypes")[0] verwendet wird.

Answer 2

In der Standardeinstellung zurückkehren jQuery Selektoren das jQuery-Objekt. Fügen Sie diese das DOM-Element zurückgegeben erhalten:

 var dropdownList = $("#requestTypes")[0];

Answer 3

Für Sachen wie diese, ich benutze texotela des Kästchen Plugin mit seiner einfachen ajaxAddOption Funktion.