Wie man vollständig select2 Steuerung säubert?

Question

Ich arbeite mit dem fantastischen select2 control.

Ich versuche, die select2 mit dem Inhalt zu reinigen und zu deaktivieren, auch so mache ich das:

$("#select2id").empty(); 
$("#select2id").select2("disable"); 

Ok, es funktioniert, aber wenn ich einen Wert hatte, ausgewählt alle Elemente entfernt werden, die Steuerung ist deaktiviert, aber der ausgewählte Wert wird weiterhin angezeigt. Ich möchte den gesamten Inhalt löschen, damit der Platzhalter angezeigt wird. Hier ist ein Beispiel, das ich habe, wo Sie das Problem sehen: http://jsfiddle.net/BSEXM/

HTML:

<select id="sel" data-placeholder="This is my placeholder"> 
    <option></option> 
    <option value="a">hello</option> 
    <option value="b">all</option> 
    <option value="c">stack</option> 
    <option value="c">overflow</option> 
</select> 
<br> 
<button id="pres">Disable and clear</button> 
<button id="ena">Enable</button> 

Code:

$(document).ready(function() { 
    $("#sel").select2(); 

    $("#pres").click(function() { 
     $("#sel").empty(); 
     $("#sel").select2("disable"); 
    }); 

    $("#ena").click(function() { 
     $("#sel").select2("enable"); 
    }); 
}); 

CSS:

#sel { 
    margin: 20px; 
} 

Haben Sie eine Idee haben, oder Ratschläge dazu?

Answer 1

Warum all diese Probleme ???

Verwendung:

$('#sel').select2('data', null); 

Answer 2

Versuchen Sie folgendes: - http://jsfiddle.net/GqbSN/

$(document).ready(function() { 
    $("#sel").select2(); 

    $("#pres").click(function() { 
     $('#s2id_sel > a > span').text($(sel).data('placeholder')); 
     //$('.select2-container > a > span').text('This is my placeholder'); 
     $("#sel").select2("disable");; 
     }); 

    $("#ena").click(function() { 
     $("#sel").select2("enable"); 
    }); 
}); 

Hinweis

$ ('# s2id_sel> a> Spanne') Text ($ (sel) .data ('Platzhalter. ')); Was ich verstehe, wenn ich dieses Plugin betrachte, ist das Markup, das es aus der Auswahl erzeugt, die wir bereitstellen, es erzeugt ID als # s2id_ + "yourselectelementid". Das wäre also ein besserer Weg, es zu verwenden, wenn Sie mehrere Auswahlsteuerelemente haben und nur einige oder nur eines davon deaktivieren möchten.

Wenn Sie die ausgewählten Inhalte löschen möchten: - http://jsfiddle.net/G7TXj/

Answer 3

Probieren Sie dies aus offiziellen select2 Dokumentationen.

$("#sel").val(null).trigger("change"); 

Hinweis: Dies ist für select2 v4 aktualisiert.

Answer 4

Jedes Mal, wenn Sie ändern oder einen Wert in select2 ändern versuchen, den Auslöser zu verwenden ("change")

$('#sel').empty().trigger("change");

Answer 5

Mein select2 in erster Option "all".Diese Option löscht die anderen Optionen und die erste Option

var $eventSelect = $("#storeList"); 
    $("#storeList").on("change", function (e) { 
     if (e.added != undefined) { 
      if (e.added.id == 0 && e.val.length>1) { 
        removeTags(); 
       $("#storeList").val('0').select2(); 

      } 

     } 

    }); 

    function removeTags(){ 
     $eventSelect.select2('data', null); 

    } 

Answer 6

Wie beantwortet Sarath Kumar ausgewählt:

$('#sel').val(null).trigger('change'); 

Referenz von der offiziellen Dokumentation, hier ist der Link:

https://select2.org/programmatic-control/add-select-clear-items#clearing-selections