ajax
Autocomplete en Drupal con sólo un enter
Carlos — Dom, 06/07/2008 - 12:50
Existe en Drupal un tipo de input tipo texto que mientras escribes te sugiere "coincidencias". Por ejemplo, si usas tags en un tipo de contenido mientras escribes te va sugiriendo coincidencias; si escribo dru me sugiere drupal ya que es uno de los tags que ya existen que empiezan con dru. Usando los cursores puedo seleccionar las sugerencias y con el enter las pongo en el input. Podéis ver un ejemplo en la API de Drupal.
El problema viene cuando lo normal es sólo introducir un término y sólo hay un input ya que has de apretar dos veces el enter, una vez para seleccionar el término sugerido y otra vez para hacer el submit del formulario. Esto no pasa en el primer ejemplo que he puesto (en los tags de un contenido) pero sí que pasa en el API de Drupal y lo mismo ocurre si tenemos una búsqueda con autocomplete. Es más usable si sólo es necesario un enter, dos confunde a la gente, lo sé por experiencia propia y ajena.
Pero existe una solución, bueno, seguro que existen muchas soluciones pero yo pondré una que hemos usando en uno de nuestros últimos proyectos, una tienda online que tiene un buscador con autocomplete (si me dejan pondré el enlace para que la veáis aunque está en beta).
Creamos un archivo .js y lo ponemos en nuestro tema. En mi caso lo he llamado mod_autocomplete.js y lo he puesto en el directorio js dentro de mi tema. En ese archivo ponemos lo siguiente:
if (Drupal.jsEnabled) {
$(document).ready(function() {
/** Prueba para el return del buscar **/
$('#block-search-0 input.form-autocomplete').bind('keyup',function(e){
if (!e) {
e = window.event;
}
//alert(e.keyCode);
switch (e.keyCode) {
case 13: // enter
this.form.submit();
return true;
}
});
});
}
Has de tener en cuenta que #block-search-0 input.form-autocomplete es el input que se comporta como autocomplete. Cómo en mi caso era el de la búsqueda he añadido #block-search-0 para que sólo se comporte así ahí. Si quieres que se comporte con sólo un enter en todos los sitio pon sólo .input.form-autocomplete aunque no creo que sea lo normal.
El código que he puesto es en realidad en parte copia del código del autocomplete.js de Drupal pero al modificarlo desde un archivo externo no modificamos el Core.
Por último hay que incluir el js y para eso pondremos el siguiente código en el template.php de nuestro tema (siempre en caso de usar phptemplate como engine de templates)
<?php
drupal_add_js(path_to_theme() . '/js/mod_autocomplete.js','theme','header');
?>
Así, si usamos la opción de optimizar javascript Drupal podrá incluir este archivo. Por cierto, todo esto está probado sólo para Drupa 5.
Comentarios recientes
hace 3 años 6 semanas
hace 3 años 39 semanas
hace 3 años 47 semanas
hace 4 años 3 días
hace 4 años 8 semanas
hace 4 años 8 semanas
hace 4 años 9 semanas
hace 4 años 10 semanas
hace 4 años 10 semanas
hace 4 años 11 semanas