Wählen Sie mehrere: So wählen Sie aus/abwählen (Javascript)

1) Ich habe keine Javascript-Kenntnisse.Wählen Sie mehrere: So wählen Sie aus/abwählen (Javascript)

2) Ich benutze ein select2 (Mehrfachauswahl) Bootstrap-Formular. 3) Ich möchte die anderen Optionen einer Gruppe abwählen, wenn ich in eine Option der entsprechenden Gruppe klicke.

3.1) Beispiel: Wenn die Optionswerte "2" und "6" ausgewählt sind und ich auf die Optionen "1" und "5" klicke, sollte automatisch die Optionen "2" und "6" deaktiviert werden.

Danke.

  <div align = "center" class="form-group"> 
 
      <label>Filtros</label> 
 
      <select name ="Filtros" id = "Filtros" class="form-control select2" multiple="multiple" data-placeholder="Selecione os Filtros" 
 
        style="width: 100%;"> 
 

 
      <optgroup label="IBC"> 
 
       <option value="1">IBC_ALL</option> 
 
       <option value="2">IBC_SIM</option> 
 
       <option value="3">IBC_NAO</option> 
 
       <option value="4">IBC_Nao_Mostrar</option> 
 

 
      <optgroup label="CROT"> 
 
       <option value="5">CROT_ALL</option> 
 
       <option value="6">CROT_SIM</option> 
 
       <option value="7">CROT_NAO</option> 
 
       <option value="8">CROT_Nao_Mostrar</option> 
 

 
      </select> 
 
      </div>

Quelle

2017-07-10 Julio

Dies erfordert kein JavaScript. Dies basiert auf dem, was der Benutzer eingibt. Um ein Vielfaches auszuwählen, müssen "CTRL" oder "SHIFT" gedrückt gehalten werden. Also, wenn ich vorher 2 und 6 gewählt hätte und diese jetzt vergessen wollte und 1 und 5 auswähle, würde ich einfach 1 drücken (ohne andere Tasten gedrückt zu haben) und dann "CTRL" halten und 5 drücken. –

Es besteht keine Notwendigkeit Sie können Ihre Frage mit HTML markieren, da die meisten Formatierungsoptionen entweder über die Symbolleiste oder einfach durch Drücken der EINGABETASTE ausgeführt werden können. –

Danke für Ihre Antwort. 1) Ich benutze dieses erste Mehrfachauswahlformular bootstrap: https://select2.github.io/examples.html. 2) Es ist nicht wie gemeinsame Mehrfachauswahl Formular, die wir halten CTRL wählen Sie die Optionen. – Julio

Es funktioniert auf mich. Wenn Sie mehrere Auswahlmöglichkeiten aus verschiedenen Kategorien auswählen, wird automatisch die Auswahl einer anderen Auswahl aus einer anderen Kategorie aufgehoben.
Hinweis: Funktioniert nicht, wenn Benutzer SHIFT Schlüssel verwenden.

<div align = "center" class="form-group"> 
<label>Filtros</label> 
<select name ="Filtros" id = "Filtros" class="form-control select2" multiple="multiple" data-placeholder="Selecione os Filtros" 
     style="width: 100%;"> 

<optgroup label="IBC" parent="1"> 
    <option value="1" childof="1">IBC_ALL</option> 
    <option value="2" childof="1">IBC_SIM</option> 
    <option value="3" childof="1">IBC_NAO</option> 
    <option value="4" childof="1">IBC_Nao_Mostrar</option> 

<optgroup label="CROT" parent="2"> 
    <option value="5" childof="2">CROT_ALL</option> 
    <option value="6" childof="2">CROT_SIM</option> 
    <option value="7" childof="2">CROT_NAO</option> 
    <option value="8" childof="2">CROT_Nao_Mostrar</option> 

</select> 
</div> 

<script> 
var selected = { 
    1:[], 
    2:[] 
} 
var last_selected = 1; 
document.getElementById('Filtros').addEventListener('click',function(e){ 
var parent = e.target.getAttribute('childof'); 

if(e.target.selected) 
{ 
    selected[parent].push(e.target); 

    for(var i=0; i < selected[parent].length; i++) 
    { 
    var elem = selected[parent][i]; 

    if(!elem.selected) 
     selected[parent].splice(i,1); 
    } 

    if(parent != last_selected) 
    { 
    for(var i=0; i < selected[last_selected].length; i++) 
    { 
     var elem = selected[last_selected][i]; 
     elem.selected = false; 
    } 
    } 

    last_selected = parent; 
} 
}); 
</script>

Quelle

2017-07-10 21:56:14 Zaphiel

Wählen Sie mehrere: So wählen Sie aus/abwählen (Javascript)

Antwort

Verwandte Themen