2016-06-25 12 views
4

ich die Bootstrap-Multiselect bin mit (http://davidstutz.github.io/bootstrap-multiselect/)Wie eine Bootstrap Mehrfachauswahl zurückgesetzt werden, wenn eine andere Bootstrap Mehrfachauswahl über jQuery verwendet wird

Ich habe zwei Dropdown-Listen, wenn ein Element in einem Drop-Down ausgewählt Ich muß die andere zurücksetzen Dropdown-Liste. Ich habe versucht, dies mit der onchange jQuery zu tun, aber ohne Erfolg.

Wenn eine Option aus Dropdown1 ausgewählt ist, deaktivieren Sie alles in Dropdown2.

<form> 
    <select id="dropdown1" name="dropdown1" multiple="multiple"> 
     <option value="1">One</option> 
     <option value="2">Two</option> 
     <option value="3">Three</option> 
    </select> 

Wenn eine Option aus dropdown2 ausgewählt wird, deaktivieren Sie alles in dropdown1.

<select id="dropdown2" name="dropdown2" multiple="multiple"> 
     <option value="1">One</option> 
     <option value="2">Two</option> 
     <option value="3">Three</option> 
    </select> 
</form> 

Mein fehlgeschlagen jQuery

$("#dropdown1").change(function() { 
    $('#dropdown2').multiselect('refresh'); 
}); 

$("#dropdown2").change(function() { 
    $('#dropdown1').multiselect('refresh'); 
}); 

Wie soll das erreicht werden?

Antwort

4

Ich vermute, dass Sie das select-Element zurücksetzen müssen und dann tun die Refresh, etwa so:

$("#dropdown1").change(function() { 
    $('#dropdown2 option:selected').each(function() { 
     $(this).prop('selected', false); 
    }) 
    $('#dropdown2').multiselect('refresh'); 
}); 

$("#dropdown2").change(function() { 
    $('#dropdown1 option:selected').each(function() { 
     $(this).prop('selected', false); 
    }) 
    $('#dropdown1').multiselect('refresh'); 
}); 

Dieser Code entlehnt aus der Code-Reset-Taste auf der Website Bootstrap Multiselect. Siehe further examples

+0

perfekt funktioniert, danke – Terry

+0

Kein Problem. Du warst fast da. –

1

Eine andere Möglichkeit, alle Optionen zu deaktivieren. (Weil Mehrfachauswahl ('Refresh') nicht für mich arbeiten.)

$('#ID').multiselect('deselectAll', false);  
$('#ID').multiselect('updateButtonText'); 
Verwandte Themen