autocompletar puede hacer clic, como Google

Question

estoy buscando un autocompletar que no tienen un botón "enviar", pero que cuando el usuario haga clic en la palabra clave de autocompletar que iba a ser redirigido a otra URL, que voy a elegir

i estoy usando http://dyve.net/jquery/?autocomplete y me gustaría poner en práctica en este guión, no utilice ningún otro (porque si el tipo i ODE en éste, se muestra el código y también ODESSA)

ejemplo:

usuario tipo 'goo' luego aparece GOOGLE para él, cuando hace clic en GOOGLE el guión lo envía a www.google.com (como "Google" => "http://www.google.com")

que sería genial si pudiera ver con el guión que ustedes dijeron no soy un programador por eso es necesario como, el código en sí, lo sé es demasiado pedir pero probé todo = \

gracias!

---

el problema en Jui autocompletar es que yo quiero hacer esto:

si escribo "ODE"

sería una muestra de "C ODE" y también "ODE SSA "

no solo desde el principio, es por eso que estoy tratando de usar su código en ese otro

también, cuando usé el código de Russ y karim79, no funcionó

Answer 1

"pero incluso el autor no sabe cómo hacer esto" ??

Creo que es fácil de hacer reemplazando la alerta del buzón de mensajes (en el example page) con una llamada a form.submit(). No lo he probado, sin embargo.

Editar: Aquí hay un código de ejemplo usando http://dyve.net/jquery/?autocomplete:

$("#mytextbox").autocomplete("form.php", {onItemSelect:submitTheForm}); 

function submitTheForm(){ 
    // redirect user to whatever URL 
} 

Answer 2

Aquí hay una complete walkthrough on how to build an autocomplete search.

Esencialmente, es necesario tener un controlador de eventos para llamar

window.location.href = "your-url-string.com"; 

al presionar entrar o al hacer clic en una selección.

EDIT:

Desde el autocomplete documentation

Búsqueda de sustitución de páginas

Un plugin de autocompletar puede ser utilizado para búsqueda de un término y redirigir a una página asociado con un artículo resultante. La siguiente es una forma de lograr la redirección:

var data = [ {text:'Link A', url:'/page1'}, {text:'Link B', url: '/page2'} ]; 
$("...").autocomplete(data, { 
    formatItem: function(item) { 
    return item.text; 
    } 
}).result(function(event, item) { 
    location.href = item.url; // navigate to the chosen URL 
}); 

Answer 3

he implementado algo por el estilo, sin embargo, mi aplicación hace uso de jQuery UI Autocomplete.

Yo uso un truco sencillo, mediante el cual los datos devueltos por el servidor es un conjunto de cadenas separadas por un carácter de nueva línea "\ n", en cada línea hay una cadena con el formato sugerencia :: url. En el cliente, simplemente me divido en el separador (uso ::) y extraigo la sugerencia del primer desplazamiento de la matriz resultante y la URL del segundo. Ejemplo:

$("#search").autocomplete("/some/page", { 
     selectFirst: false, 
     formatItem: function(data, i, n, value) { 
      //make the suggestion look nice 
      return "<font color='#3399CC'>" + value.split("::")[0] + "</font>"; 
     }, 
     formatResult: function(data,value) { 
      //only show the suggestions and not the URLs in the list 
      return value.split("::")[0]; 
     } 
    }).result(function(event, data, formatted) { 
     //redirect to the URL in the string 
     var pieces = formatted.split("::"); 
     window.location.href = pieces[1]; 
    }); 

Para aclarar lo que quiero decir, supongamos que escribe 'goo'. El servidor puede devolver:

google::www.google.com\ngoodstuff::www.example.com 

Ese usuario verá aparecer una lista con 'google' y 'goodstuff'. Al hacer clic en uno de ellos se ejecutará el método result de Autocompletar, donde simplemente tomo la parte de la URL de la cadena y la redirecciono. Espero que ayude.

Answer 4

el complemento jQuery Autocompletar tiene una opción matchContains que buscará dentro del resultado. Establézcalo en verdadero y devolverá las coincidencias de subcadenas también.

Answer 5

el código siguiente funciona bien para mí para convertir un cuadro de búsqueda con datos a una fuente de datos remota (base de datos MySQL) en un campo de búsqueda y un redirector si un usuario selecciona uno de los resultados sugeridos:

$("#search").autocomplete("search.php", { 
    width: 260, 
    formatItem: function(data) { 
      return data[0]; 
      } 
     }).result(function(event, data) { 
    window.location.href = data[1]; 
}); 

nota: que tenía que hacer que los datos ajax separados en dos partes:

1. el término de búsqueda
2. la URL relacionada con ese término

por ej.

Brad Pitt |/actores/bradpitt

Matt Damon |/actores/Matt Damon

jQuery autocompletado separa automáticamente los datos en la barra vertical (|) y por cada nueva línea de

Answer 6

ejemplo más simple que puede encontrar en JSFiddle

var data = [ 
    { 
     value: 'Google', 
     url: 'http://www.google.com' 
    }, 
    { 
     value: 'StackOverflow', 
     url: 'http://www.stackoverflow.com' 
    } 
]; 

$("input").autocomplete({ 
    source: data, 
    select: function(event, ui) { 
     window.location = ui.item.url; 
    } 
});