javascript - tagify - tagit

Autocompletar jQuery: ¿cómo manejar datos adicionales?

Question

Estoy luchando con el siguiente problema. Uso el complemento de autocompletado de jQuery para obtener una lista de valores sugeridos del servidor. La lista se vería así:

Username1|UserId1 Username2|UserId2

Entonces, si empiezo a escribir "U", aparece una lista de "Username1" de "Username1" y "Username2" usuario2 "Username2" , como se esperaba. Pude elegir el primer elemento y el valor de <input> se convertiría en "Username1" , pero lo que realmente deseo enviar al servidor es la identificación del usuario.

¿Puedo de alguna manera obtener la ID que está siguiendo el nombre de usuario? Tengo la intención de hacer la publicación del formulario sobre el cambio del cuadro de texto. ¿Tal vez estoy demasiado ciego para verlo en los documentos o para encontrarlo en Google?

Answer 1

Use el método de result del complemento de autocomplete para manejar esto. Los datos se pasan como una matriz a la devolución de llamada y solo necesita guardar los data[1] algún lugar. Algo como esto:

$("#my_field").autocomplete(...).result(function(event, data, formatted) {
if (data) {
$("#the_id").attr("value", data[1]);
}
});

Answer 2

Iba a enumerar algunos métodos aquí, pero todos menos uno son basura. Haga la conversión string-> user en el servidor como lo ha estado haciendo para generar una lista para el autocompletado.

Por supuesto, mantenga el autocompletado y valide AJAX, pero si intenta y contrabando datos de formularios vitales (como este) en el formulario a través de JS, algo saldrá mal en algún momento.

Además, si necesita manejar agentes de usuario que no sean js, deberá escribir este método de cualquier forma.

Answer 3

FYI, este artículo http://vivien-chevallier.com/Articles/use-bing-maps-rest-services-with-jquery-to-build-an-autocomplete-box-and-find-a-location-dynamically has una buena forma de hacerlo a través de la función del autor ''displaySelectedItem'' que se llama a través del evento jQuery autocompletar ''select'' (consulte el artículo para obtener el código completo).

Aclamaciones

Mate