Tengo el siguiente script que funciona con una matriz unidimensional. ¿Es posible hacer que esto funcione con una matriz bidimensional? Luego, cualquiera que sea el elemento seleccionado, al hacer clic en un segundo botón en la página, debe mostrar la identificación del elemento seleccionado.
Este es el script con la matriz unidimensional:
var $local_source = ["c++", "java", "php", "coldfusion", "javascript", "asp", "ruby"]; $("#txtAllowSearch").autocomplete({ source: $local_source });Esta es la secuencia de comandos para el botón para verificar la identificación, que está incompleta:
$('#button').click(function() { // alert($("#txtAllowSearch").someone_get_id_of_selected_item); });Debe usar las propiedades ui.item.label (el texto) y ui.item.value (el id)
$('#selector').autocomplete({ source: url, select: function (event, ui) { $("#txtAllowSearch").val(ui.item.label); // display the selected text $("#txtAllowSearchID").val(ui.item.value); // save selected id to hidden input } }); $('#button').click(function() { alert($("#txtAllowSearchID").val()); // get the id from the hidden input });[Editar] También preguntaste cómo crear la matriz multidimensional...
Debería poder crear la matriz así:
var $local_source = [[0,"c++"], [1,"java"], [2,"php"], [3,"coldfusion"], [4,"javascript"], [5,"asp"], [6,"ruby"]];Lea más sobre cómo trabajar con matrices multidimensionales aquí: http://www.javascriptkit.com/javatutors/literal-notation2.shtml
Desde la pestaña Descripción general del complemento de autocompletar de jQuery:
Los datos locales pueden ser una simple matriz de cadenas o contener objetos para cada elemento de la matriz, con una propiedad de etiqueta o de valor, o ambas. La propiedad de la etiqueta se muestra en el menú de sugerencias. El valor se insertará en el elemento de entrada después de que el usuario haya seleccionado algo del menú. Si solo se especifica una propiedad, se utilizará para ambas, por ejemplo. si solo proporciona propiedades de valor, el valor también se utilizará como etiqueta.
Entonces, su matriz "bidimensional" podría verse así:
var $local_source = [{ value: 1, label: "c++" }, { value: 2, label: "java" }, { value: 3, label: "php" }, { value: 4, label: "coldfusion" }, { value: 5, label: "javascript" }, { value: 6, label: "asp" }, { value: 7, label: "ruby" }]; Puede acceder a las propiedades de la etiqueta y el valor dentro del focus y select el evento a través del argumento ui usando ui.item.label y ui.item.value .
Editar
Parece que tiene que "cancelar" el enfoque y seleccionar eventos para que no coloque los números de identificación dentro de los cuadros de texto. Mientras lo hace, puede copiar el valor en una variable oculta en su lugar. Aquí hay un ejemplo .
Mi código solo funcionó cuando agregué 'devolver falso' a la función de selección. Sin esto, la entrada se configuró con el valor correcto dentro de la función de selección y luego se configuró en el valor de identificación después de que finalizó la función de selección. El retorno falso resolvió este problema.
$('#sistema_select').autocomplete({ minLength: 3, source: <?php echo $lista_sistemas;?> , select: function (event, ui) { $('#sistema_select').val(ui.item.label); // display the selected text $('#sistema_select_id').val(ui.item.value); // save selected id to hidden input return false; }, change: function( event, ui ) { $( "#sistema_select_id" ).val( ui.item? ui.item.value : 0 ); } });Además, agregué una función al evento de cambio porque, si el usuario escribe algo en la entrada o borra una parte de la etiqueta del elemento después de seleccionar un elemento, necesito actualizar el campo oculto para no obtener el Identificación incorrecta (obsoleta). Por ejemplo, si mi fuente es:
var $local_source = [ {value: 1, label: "c++"}, {value: 2, label: "java"}]y el usuario escribe ja y selecciona la opción 'java' con el autocompletar, almaceno el valor 2 en el campo oculto. Si el usuario borra una letra de 'java', por ejemplo, termina con 'jva' en el campo de entrada, no puedo pasar a mi código el id 2, porque el usuario cambió el valor. En este caso puse el id en 0.