2012-06-08 12 views
11

Tengo un cuadro de selección que contiene las opciones y optgroup que se generan dinámicamente usando php.Now cuando selecciono "TODAS" todas las demás optgroup, las opciones deben estar deshabilitadas y cuando selecciono una opción distinta de "ALL" la opción "Todos" se debe desactivarCómo habilito/deshabilito opciones en Seleccionar cuadro usando jquery

<select name="select1" id ="select1" onchange="handleSelect()"> 
    <option value ="-1">ALL</option> 
    <optgroup label="CARS"> 
     <option value="ford">FORD</option> 
     <option value="Nissan">Nissan</option> 
    </optgroup> 
</select> 
<script> 
    function handleSelect() { 
     var selectVal = $("#select1:selected").text(); 
     if (selectVal == "ALL") { 
      // cannot disable all the options in select box 
      $("#select1 option").attr("disabled", "disabled"); 
     } 
     else { 
      $("#select1 option[value='-1']").attr('disabled', 'disabled'); 
      $("#select1 option").attr('disabled', ''); 
     } 
    } 
</script> 

¿Cómo puedo hacer este trabajo?

+1

¿Cómo puede * seleccionar cualquier opción que no sea "ALL" * si todas las opciones están deshabilitadas cuando seleccionó "ALL" (y viceversa)? – VisioN

Respuesta

20

Esta es una especie de algo extraño estar haciendo, pero aquí está el código que cumpla con su requisitos.

$('select').on('change', function() { 
    if (this.value == '-1') { 
     $('optgroup option').prop('disabled', true); 
    } else { 
     $('optgroup option').prop('disabled', false); 
    } 
}); 

vivo Ejemplo-http://jsfiddle.net/NpNFh/

0

Se pueden utilizar dos variaciones sobre la sintaxis para el atributo discapacitados, dependiendo de la versión de HTML que se dirigen:

HTML4: <option value="spider" disabled>Spider</option> 
XHTML: <option value="spider" disabled="disabled">Spider</option> 
8

Usted puede utilizar el siguiente code.Let nos cuenta que tiene tres cajas de selección de la siguiente manera

<select class="sel_box" id="sel_1" onchange="disable_sel(this.value);" ></select> 
<select class="sel_box" id="sel_2" onchange="disable_sel(this.value);" ></select> 
<select class="sel_box" id="sel_3" onchange="disable_sel(this.value);" ></select> 

y en función Let 'opt' es el argumento ahora use siguiente

$('.sel_box option[value="'+opt+'"]').attr("disabled", true); 
Cuestiones relacionadas