Wyczyść listę rozwijaną z JQuery

Question

Napisałem tę małą funkcję, aby wypełnić listę rozwijaną danymi z serwera.

function fillDropDown(url, dropdown) { 
    $.ajax({ 
     url: url, 
     dataType: "json" 
    }).done(function (data) { 
     // Clear drop down list 
     $(dropdown).find("option").remove(); <<<<<< Issue here 
     // Fill drop down list with new data 
     $(data).each(function() { 
      // Create option 
      var $option = $("<option />"); 
      // Add value and text to option 
      $option.attr("value", this.value).text(this.text); 
      // Add option to drop down list 
      $(dropdown).append($option); 
     }); 
    }); 
} 

mogę następnie wywołać funkcję w następujący sposób:

fillDropDown("/someurl/getdata", $("#dropdownbox1")) 

Wszystko działa doskonale, z wyjątkiem jednej linii, gdzie jestem rozliczającego starych danych z listy rozwijanej. Co ja robię źle?

Wszelkie wskazówki, które mogą pomóc w ulepszeniu tego kodu, są również wysoko cenione.

Answer 1

Wystarczy użyć .empty():

// snip... 
}).done(function (data) { 
    // Clear drop down list 
    $(dropdown).empty(); // <<<<<< No more issue here 
    // Fill drop down list with new data 
    $(data).each(function() { 
     // snip... 

---

Jest też a more concise way budować opcje:

// snip... 
$(data).each(function() { 
    $("<option />", { 
     val: this.value, 
     text: this.text 
    }).appendTo(dropdown); 
}); 

Answer 2

Jak o przechowywaniu nowy options w variable, a następnie za pomocą .html(variable) zastąpić dane w container?

Answer 3

Próbowałem zarówno .empty(), jak i .remove() dla mojego rozwijanego i oba były powolne. Ponieważ miałem prawie 4000 opcji.

Użyłem .html(""), który jest znacznie szybszy w moim stanie.
czyli poniżej

$(dropdown).html(""); 

Answer 4

<select id="ddlvalue" name="ddlvaluename"> 
<option value='0' disabled selected>Select Value</option> 
<option value='1' >Value 1</option> 
<option value='2' >Value 2</option> 
</select> 

<input type="submit" id="btn_submit" value="click me"/> 



<script> 
$('#btn_submit').on('click',function(){ 
     $('#ddlvalue').val(0); 
}); 
</script>