javascript attr - JQuery:cómo seleccionar el elemento desplegable según el valor




find each (9)

Quiero configurar un menú desplegable (seleccionar) para que cambie en función del valor de las entradas.

yo tengo

<select id="mySelect">
  <option value="ps">Please Select</option>
  <option value="ab">Fred</option>
  <option value="fg">George</option>
  <option value="ac">Dave</option>
</select>

Y sé que quiero cambiar el menú desplegable para que se seleccione la opción con el valor de "fg". ¿Cómo puedo hacer esto con JQuery?


Answers

En su caso $("#mySelect").val("fg") :)


Tengo una situación diferente, donde los valores de la lista desplegable ya están codificados. Solo hay 12 distritos, por lo que el control de la interfaz de usuario de jQuery Autocomplete no está poblado por código.

La solución es mucho más fácil. Debido a que tuve que pasar a través de otras publicaciones donde se suponía que el control se cargaba dinámicamente, no estaba encontrando lo que necesitaba y finalmente lo descubrí.

Entonces, si tiene HTML como se muestra a continuación, establecer el índice seleccionado se establece de esta manera, tenga en cuenta la parte de entrada, que es adicional al ID desplegable:

$('#project-locationSearch-dist-input').val('1');

                <label id="lblDistDDL" for="project-locationSearch-input-dist" title="Select a district to populate SPNs and PIDs or enter a known SPN or PID." class="control-label">District</label>
                <select id="project-locationSearch-dist" data-tabindex="1">
                    <option id="optDistrictOne" value="01">1</option>
                    <option id="optDistrictTwo" value="02">2</option>
                    <option id="optDistrictThree" value="03">3</option>
                    <option id="optDistrictFour" value="04">4</option>
                    <option id="optDistrictFive" value="05">5</option>
                    <option id="optDistrictSix" value="06">6</option>
                    <option id="optDistrictSeven" value="07">7</option>
                    <option id="optDistrictEight" value="08">8</option>
                    <option id="optDistrictNine" value="09">9</option>
                    <option id="optDistrictTen" value="10">10</option>
                    <option id="optDistrictEleven" value="11">11</option>
                    <option id="optDistrictTwelve" value="12">12</option>
                </select>

Otra cosa que descubrió sobre el control Autocompletar es cómo desactivarlo / vaciarlo correctamente. Tenemos 3 controles trabajando juntos, 2 de ellos mutuamente exclusivos:

//SPN
spnDDL.combobox({
    select: function (event, ui) {
        var spnVal = spnDDL.val();
        //fire search event
        $('#project-locationSearch-pid-input').val('');
        $('#project-locationSearch-pid-input').prop('disabled', true);
        pidDDL.empty(); //empty the pid list
    }
});
//get the labels so we have their tool tips to hand.
//this way we don't set id values on each label
spnDDL.siblings('label').tooltip();

//PID
pidDDL.combobox({
    select: function (event, ui) {
        var pidVal = pidDDL.val();
        //fire search event
        $('#project-locationSearch-spn-input').val('');
        $('#project-locationSearch-spn-input').prop('disabled', true);
        spnDDL.empty(); //empty the spn list
    }
});

Algo de esto está más allá del alcance de la publicación y no sé dónde ponerlo exactamente. Dado que esto es muy útil y tomó un tiempo para descifrarlo, se comparte.

Y también ... para habilitar un control como este, es (deshabilitado, falso) y NO (habilitado, verdadero), eso también tomó un poco de tiempo para averiguarlo. :)

La única otra cosa a tener en cuenta, además de la publicación, es:

    /*
Note, when working with the jQuery Autocomplete UI control,
the xxx-input control is a text input created at the time a selection
from the drop down is picked.  Thus, it's created at that point in time
and its value must be picked fresh.  Can't be put into a var and re-used
like the drop down list part of the UI control.  So you get spnDDL.empty()
where spnDDL is a var created like var spnDDL = $('#spnDDL);  But you can't
do this with the input part of the control.  Winded explanation, yes.  That's how
I have to do my notes or 6 months from now I won't know what a short hand note means
at all. :) 
*/
    //district
    $('#project-locationSearch-dist').combobox({
        select: function (event, ui) {
            //enable spn and pid drop downs
            $('#project-locationSearch-pid-input').prop('disabled', false);
            $('#project-locationSearch-spn-input').prop('disabled', false);
            //clear them of old values
            pidDDL.empty();
            spnDDL.empty();
            //get new values
            GetSPNsByDistrict(districtDDL.val());
            GetPIDsByDistrict(districtDDL.val());
        }
    });

Todos compartidos porque llevó demasiado tiempo aprender estas cosas sobre la marcha. Espero que esto sea útil.


Puede seleccionar el valor de la opción desplegable por nombre

jQuery("#option_id").find("option:contains('Monday')").each(function()
{
 if( jQuery(this).text() == 'Monday' )
 {
  jQuery(this).attr("selected","selected");
  }
});

$('#dropdownid').val('selectedvalue');

$('#mySelect').val('ab').change();

Puede ser demasiado tarde para responder, pero al menos alguien recibirá ayuda.

Puedes probar dos opciones:

Este es el resultado cuando desea asignar basado en el valor del índice, donde '0' es Index.

 $('#mySelect').prop('selectedIndex', 0);

no use 'attr' ya que está en desuso con la última jquery.

Cuando desee seleccionar según el valor de la opción, elija esto:

 $('#mySelect').val('fg');

donde 'fg' es el valor de la opción


Puedes simplemente usar:

$('#select_id').val('fg')

$('#yourdropddownid').val('fg');

Opcionalmente,

$('select>option:eq(3)').attr('selected', true);

donde 3 es el índice de la opción que desea.

Demo en vivo


Y si desea unirse a la mesa consigo mismo (lo que no ocurrirá con demasiada frecuencia):

update t1                    -- just reference table alias here
set t1.somevalue = t2.somevalue
from table1 t1               -- these rows will be the targets
inner join table1 t2         -- these rows will be used as source
on ..................        -- the join clause is whatever suits you




javascript jquery select jquery-selectors