Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

369
Vistas
Combobox de la interfaz de usuario de jquery ONCHANGE

¿Cómo puedo adjuntar una función de cambio en un cuadro combinado de jqueryUI? Aquí está mi código:

 $(".cmbBox").combobox({ change:function(){ alert($(this).val()); } });

Cuando el valor cambie, alertará el valor actualizado.

Cualquier ayuda por favor.. :)

over 4 years ago · Santiago Trujillo
3 Respuestas
Responde la pregunta

0

La fuente de ejemplo del cuadro combinado está bien allí en el ejemplo. Activaría el evento de change de la selección subyacente modificando el código fuente de esta manera (cambiando el controlador de eventos de select dentro de la inicialización de autocompletar dentro del complemento):

 /* Snip */ select: function( event, ui ) { ui.item.option.selected = true; self._trigger( "selected", event, { item: ui.item.option }); select.trigger("change"); }, /* Snip */

y luego defina un controlador de eventos para el evento de change regular de la select :

 $(".cmbBox").change(function() { alert(this.value); });

Desafortunadamente, esto no funcionará exactamente de la misma manera que el evento select.change normal: activará incluso si selecciona el mismo elemento del cuadro combinado.

Pruébelo aquí: http://jsfiddle.net/andrewwhitaker/hAM9H/

over 4 years ago · Santiago Trujillo Denunciar

0

En mi humilde opinión, una forma aún más simple de detectar que el usuario ha cambiado el cuadro combinado (sin tener que modificar el código fuente del cuadro combinado de autocompletado de jQuery UI) es la siguiente; esto funciona para mi Es repetitivo si tienes muchos, aunque seguramente hay una forma de refactorizar. Gracias a todos los que han estudiado y explicado este widget en profundidad, aquí y en otros lugares.

 $("#theComboBox").combobox({ select: function (event, ui) { alert("the select event has fired!"); } } );
over 4 years ago · Santiago Trujillo Denunciar

0

En el complemento ui.combobox:

agregué al final del método de selección:

 $(input).trigger("change", ui);

agregué antes de la "entrada var ...":

 select.attr('inputId', select.attr('id') + '_input');

después, para tener un evento onchange funcional... en ui.combobox, comenté el método de cambio y moví su código al método checkval que extiende ui.autocomplete:

 $.extend( $.ui.autocomplete, { checkVal: function (select) { var matcher = new RegExp("^" + $.ui.autocomplete.escapeRegex($(this).val()) + "$", "i"), valid = false; $(select).children("option").each(function () { if ($(this).text().match(matcher)) { this.selected = valid = true; return false; } }); if (!valid) { // remove invalid value, as it didn't match anything $(this).val(""); $(select).val(""); $(this).data("autocomplete").term = ""; $(this).data("autocomplete").close(); } } });

y codifiqué el método de cambio de entrada de la siguiente manera:

 var oCbo = ('#MyCbo').combobox(); $('#' + oCbo.attr('inputId')).change(function () { // from select event : check if value exists if (arguments.length < 2) { $.ui.autocomplete.checkVal.apply(this, [oCbo]); } // YOUR CODE HERE });
over 4 years ago · Santiago Trujillo Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda