Sv Community El Salvador
Soporte y Tecnología => Programación => Web => Mensaje iniciado por: NoeL en enero 26, 2009, 02:18:31 pm
-
Estoy trabajando con JSP y deseo que en una tabla que obviamente esta dentro de un DIV se me actualicen los registros de acuerdo a la letra que el usuario presione en una caja de texto, algo asi como una consulta dinamica, para lograr mi cometido estoy haciendo uso de la libreria prototype incluida en scriptaculous, hasta cierto punto lo que quiero funciona pero no al 100% como yo lo deseo, pues cuando el usuario digita una letra se ejecuta la consulta pero sin incluir la ultima tecla pulsada, es algo dificil de explicar pero voy a tratar de ilustrarlo:
por ejemplo si el usuario ha digitado en la caja de texto: Jua
Deberia devolver todos los registros que coinciden con las 3 letras : jua
el problema es que solo devuelve los registros de 2 letras: ju
como si no se alcanzara a capturar la ultima letra que se va pulsando, ya intente con varios eventos de la caja de texto como lo son: onchange, onkeypress, onkeyup, onkeydown y onblur, todos presentan el mismo problema, el codigo de esta caja de texto lo tengo de la siguiente manera:
Codigo HTML de la pagina expmain.jsp (aqui es donde el usuario hace la busqueda y se muestran los resultados)
<input id="search" name="search" type="text" onkeydown="new Ajax.Updater('panelderecho','expmain_updatediv.jsp?condicion='+this.value);">
<div id="panelderecho">
</div>
esta es la pagina que actualiza al div:
Codigo Pagina expmain_updatediv.jsp
<%
String cond=request.getParameter("condicion");
out.println(cond);
clsConexionBD icn=(clsConexionBD) application.getAttribute("BaseDatos");
clsNomTab tb = new clsNomTab();
out.println("<table>");
out.println("<th>ID</th>");
out.println("<th>Nombres</th>");
out.println("<th>Apellidos</th>");
out.println("<th>DUI</th>");
out.println("<th>Código</th>");
out.println("<tr>");
clsMaestros exped=new clsMaestros(tb.EXPEDIENTES);
Collection cexp = exped.Consultar(icn, cond);
if (cexp != null){
if(cexp.size()>0){
for (Iterator it=cexp.iterator(); it.hasNext();){
clsRegistros regexp=(clsRegistros) it.next();
out.println("<tr>");
out.println("<td>"+regexp.getc1()+"</td><td>"+regexp.getc2()+"</td><td>"+regexp.getc3()+"</td><td>"+regexp.getc4()+"</td><td>"+regexp.getc9());
out.println("</tr>");
}
}
}
out.println("</tr>");
out.println("</table>");
Lo ultimo que me hace falta probar es lo siguiente, segun leo en la referencia del Ajax.updater yo bien podria pasar en valor de la variable condicion por medio de un parametro que se llama parameters de la siguiente manera:
new Ajax.Updater('items', '/items', {
parameters: { text: $F('text') }
});
el problema principal es que por ningun lado del bendito internet me dicen como recupero ese valor del otro lado para pasarselo como condicion a la consulta SQL en esta parte:
Collection cexp = exped.Consultar(icn, cond);
ya me di riata 2 dias sin ningun efecto positivo, que alguien me ilumine pues necesito avanzar en el desarrollo de esta cosa...
-
Lo de los parametros esta explicado acá:
http://www.prototypejs.org/api/ajax/options (http://www.prototypejs.org/api/ajax/options)
Si lo usas en modo GET (como en tu ejemplo) entonces se pasan como parametros GET (obteniendolas con request.getParameter), y si no pues como POST.
Como podras deducir de lo anterior, los parametros no son la solucion a tu problema.
Con respecto al problema que tenes (bastante extraño que no te funcione bien en OnKeyUp) casi hasta podria apostar que el culpable es el script 'expmain_updatediv.jsp' que en algun momento le esta removiendo la ultima letra a la consulta.
De:
clsMaestros exped=new clsMaestros(tb.EXPEDIENTES);
Collection cexp = exped.Consultar(icn, cond);
Ahi mira si ese "Consultar" no te esta comiendo la letra. O es que desde "out.println(cond);" ves que te falta esa ultima letra?
-
lo hice con onkeyup y funciona de toque asi que se me hace que algo no tenes bien pero en tu consulta a base de datos, inclusive en onkeyup puse un simple alert con this.value y justo imprime todas las letras, luego probe el updater con el script que recibe el requet que solo imprimiera la variable que recibia y todo nitido revisa tus consultas mejor :p
Para estar triplemente seguro vi en firefox el live http headers y manda la palabra completa :thumbsup:
-
Incluso acá usan onKeyUp:
http://dbachrach.com/blog/2007/04/15/spotlight-like-search-as-you-type-with-css-ajax-js/ (http://dbachrach.com/blog/2007/04/15/spotlight-like-search-as-you-type-with-css-ajax-js/)
-
Ahi mira si ese "Consultar" no te esta comiendo la letra. O es que desde "out.println(cond);" ves que te falta esa ultima letra?
exacto ahi veo que hasta que presiono la siguiente tecla manda las anteriores, es como un efecto de retraso, pero en realidad no entiendo por que..., realmente no puede ser del lado de Java por que aunque le quite todo el codigo de java siempre genera el mismo problema cuando imprimo esa variable cond
lo hice con onkeyup y funciona de toque asi que se me hace que algo no tenes bien pero en tu consulta a base de datos, inclusive en onkeyup puse un simple alert con this.value y justo imprime todas las letras, luego probe el updater con el script que recibe el requet que solo imprimiera la variable que recibia y todo nitido revisa tus consultas mejor :p
Para estar triplemente seguro vi en firefox el live http headers y manda la palabra completa :thumbsup:
no seria mucha molestia que pongas el codigo
-
SOLUCIONADO
volvi a probar el evento onkeyUp y funciono, quiza en mi deseperacion no me fije bien cuando probe este evento, y lo mas increible es que ya antes habia hecho esto con el evento onkeypress con php pero al parecer con jsp no funciona...
gracias vlad y rdoggsv ...sois la leche
-
curiosidad noel, tu criterio para escojer prototype en vez de jquery o mootools? (no sé para qué lado tirarme)
-
curiosidad noel, tu criterio para escojer prototype en vez de jquery o mootools? (no sé para qué lado tirarme)
mira en realidad yo he elegido prototype por que es lo que mas o menos manejo y no tengo tiempo para aprender a usar otro framework, pero en muchas partes se oye de que trae demasiadas cosas que no se ocupan que lo vuelven mas pesado que jquery, si estas dispuesto a aprender a usar jquery es lo que mas recomiendan los desarrolladores...tal vez alguien con mas experiencia en el area nos ilumina con respecto a eso...
-
me respondo solo aqui una comparacion mas tecnica:
As part of my Mootools lecture at Codecamp I showed a brief speed comparison between the most used Javascript Frameworks running in the major browsers. Now as the Mootools team has extended their performance test tool (slickspeed) it is time to revise my benchmarks and extend them over more browser/platforms.
Test results (Lower is better):
(http://blog.creonfx.com/examples/javascript/speed-compersion-graph-dark.gif)
*For example FF (XP-NA) is Firefox 2.0.0.12 with no addons (extensions) enabled running under Windows XP
fuente:http://blog.creonfx.com/javascript/dojo-vs-jquery-vs-mootools-vs-prototype-performance-comparison (http://blog.creonfx.com/javascript/dojo-vs-jquery-vs-mootools-vs-prototype-performance-comparison)
-
yo quisiera ver ese test actualizado a jquery 1.3.1 que trae muchas mejoras. Y la verdad goomba depende para que lo necesitas que vas a elegir un framework y nunca came mal que entedas a usar mas de uno porque alguna vez te encontras con que tenes que desarrollar con uno y despues con otro.
http://blog.jquery.com/2009/01/21/jquery-131-released/
A mi simplemente me gusta jquery por que siento que hay mas documentación, siento que sacan updates mas seguidos, y para lo poco que en realidad lo necesito funciona de maravilla asi que para que cambiarlo :p
Pero un dia de estos estaba viendo Dojo y si queres usar los widgets que tiene podes hacer unas cosas bien fumadas.
-
hey y esa tabla está con el nuevo intérprete de JS de firefox?
yo he trastiado jquery y mootools, pero solo hasta descomprimirlos, ver lo q traen... talvez empezar algo pequeño pero hasta ahí
-
Ahi sale una pagina para poder hacer las pruebas automaticamente:
http://mootools.net/slickspeed/ (http://mootools.net/slickspeed/)
Por ejemplo a mi (usando Firefox 3.0 sobre Kubuntu 8.10) me salió que Dojo era el mas rapido:
(http://i.todosv.com/m/b3209e44594c4872e50c55daf63816b5.png.jpeg) (http://i.todosv.com/+/b3209e44594c4872e50c55daf63816b5.png)
-
buen aporte vlad! pues a mi me salió Dojo en primer lugar, de ahi mootools, de ahi prototype (3 veces mas lento que dojo) y el Yui beta q fué 4 veces más lento casi...
-
hey y esa tabla está con el nuevo intérprete de JS de firefox?
Misma configuración, Firefox 3.1 (Con el motor JS TraceMonkey):
(http://i.todosv.com/m/17500183f8d1d76c7f5698764c16b254.png.jpeg) (http://i.todosv.com/+/17500183f8d1d76c7f5698764c16b254.png)
Aparentemente Dojo gana... si no fuera porque al parecer no se lleva bien con el nuevo motor de Firefox 3.1 (vean el monton de errores :phew:)
-
Misma configuración, Firefox 3.1 (Con el motor JS TraceMonkey):
(http://i.todosv.com/m/17500183f8d1d76c7f5698764c16b254.png.jpeg) (http://i.todosv.com/+/17500183f8d1d76c7f5698764c16b254.png)
Aparentemente Dojo gana... si no fuera porque al parecer no se lleva bien con el nuevo motor de Firefox 3.1 (vean el monton de errores :phew:)
yo creo q es mas clavo de linux que de firefox, a mi con el ff3.1 y tracemonkey no me tiró ningún error, solo un par de resultados con returns distintos pero hasta ahí
olvidalo, la 3.05 tengo, esta no trae trace monkey, pero igual, es de rapida...
bueno y a todo esto, cual será la causa de la velocidad de dojo? es mas eficiente o tiene menos ondas?
-
Esperemos que actualicen a jquery 1.3.1 y ahi si siento que es digno de dar un resultado.
Tambien que por lo menos en mi caso no me enfoco en la rapidez de javascript sino en todo lo que me permita hacer y lo comodo que sea usarlo :p
-
http://nettuts.com/tutorials/javascript-ajax/everything-you-need-to-know-about-jquery-13/ (http://nettuts.com/tutorials/javascript-ajax/everything-you-need-to-know-about-jquery-13/)
Retocando el tema de el nuevo jquery y las comparaciones de selectores :thumbsup:
En IE siempre queda un poco mejor Dojo en los demas si se le va mejor jquery :thumbsup:
Ahi pueden leer que trae de nuevo el 1.3
(http://nettuts.s3.amazonaws.com/190_jQuery13/selector_tests.png)