Foro de elhacker.net

Programación => Desarrollo Web => Mensaje iniciado por: naderST en 8 Febrero 2010, 19:48 pm



Título: Evento onsubmit javascript IE 8
Publicado por: naderST en 8 Febrero 2010, 19:48 pm
Buenas tenía problemas con el evento onsubmit de los formularios con IE 8 lo que pasa es lo siguiente tengo un buscador que quiero que trabaje con ajax osea que no recargue la página, lo hace perfectamente en Chrome y FF pero en IE 8 no funciona recarga la página como si se enviara normalmente. Aquí esta el código:

Buscador
Código
  1. <form name="buscar_form" id="buscar_form" onsubmit="buscar(); return false;">


Function buscar()
Código
  1. function buscar(){
  2.   var c = $("#cadena").val();
  3.   var cd = $("#ciudad").val();
  4.   var r = $("#categorias");
  5.  
  6.   if(($.trim(c) == "") || ($.trim(cd) == "") || ($.trim(c) == "Nombre de la empresa o servicio")){
  7.      alert('Debes colocar una empresa o servicio a buscar.');
  8.   } else {
  9.      r.html("<br /><p align=\"center\"><img src=\"images/cargando.gif\" /></p>");
  10.      $.ajax({ type: "GET", url: "nav/buscar.php?cadena=" + c + "&ciudad=" + cd, cache: false, data: "", success: function(response){ r.html(response); $("#cadena").val("Nombre de la empresa o servicio"); $("#ciudad").val("Selecciona una ciudad"); } });
  11.   }
  12. }

No se sí me expliqué bien pero estoy apunto de poner un botón con un onnlick="buscar();" y dejarlo así


Título: Re: Evento onsubmit ‭‬‭‬‭‬javascript IE 8
Publicado por: Nakp en 8 Febrero 2010, 20:08 pm
prueba return buscar(); y haz que buscar() retorne true, si retorna false el evento "onsubmit" será cancelado :P

ademas si usas jquery evita mezclar el ‭‬javascript con html, jquery incorpora eventos y para algo funcionan los selectores

Código
  1. $('#buscar_form').submit(function(){
  2. //agrega tu codigo aqui
  3. });


Título: Re: Evento onsubmit ‭‬‭‬javascript IE 8
Publicado por: naderST en 8 Febrero 2010, 20:16 pm
Me pasa lo siguiente coloque onsubmit="return false;" y use el evento submit de jquery. Me sigue pasando lo mismo me funciona perfecto en Chrome y en FireFox pero en IE8 no me funciona y me tira el siguiente error: Se requiere un objeto (En la linea 14 del archivo jquery.js)

EDIT:

Si no llamo a la función buscar() y pongo un alert() funciona bien en todos :S


Título: Re: Evento onsubmit ‭‬‭‬javascript IE 8
Publicado por: Nakp en 8 Febrero 2010, 20:28 pm
en ese caso elimina onsubmit de tu html ya que esta sobrando (no soy seguidor de los eventos incrustados xD)

intenta depurar el codigo y fijate en que ejecucion se provoca el error

prueba mover los trim() (estetica)

Código
  1. var c = $("#cadena").val().trim();
  2. var cd = $("#ciudad").val().trim();

y agrega PUNTO Y COMA al final de la definicion de variables :xD


Título: Re: Evento onsubmit ‭‬‭‬‭‬javascript IE 8
Publicado por: naderST en 8 Febrero 2010, 20:40 pm
Nada ahora no me tira error pero en IE8 simplemente recarga la página estoy haciendo esto:
Código
  1. $("#buscar_form").submit(function(){ return buscar(); });

buscar retorna false pero algo curioso es que si lo pongo así:

Código
  1. $("#buscar_form").submit(function(){ alert('Hijo ...'); return false; });

Funciona perfecto en IE8 Chrome y FF osea quiere decir que hay algo mal en la función buscar() :S pero ni idea

EDIT:

Todo tiene PUNTO Y COMA  :xD al parecer cuando lo publico aca se quitan o.O


Título: Re: Evento onsubmit ‭‬‭‬javascript IE 8
Publicado por: Nakp en 8 Febrero 2010, 21:07 pm
el false es para cancelar el evento submit imagino que quieres cancelar el envio del formulario y usar unicamente ajax... y a lo que me referia era a esto:


Código
  1. $('#buscar_form').submit(function(){
  2. var c = $("#cadena").val().trim();
  3. var cd = $("#ciudad").val().trim();
  4. var r = $("#categorias");
  5.  
  6. if((c == "") || (cd == "") || (c == "Nombre de la empresa o servicio")){
  7. alert('Debes colocar una empresa o servicio a buscar.');
  8. } else {
  9. r.html("<p align=\"center\"><img src=\"images/cargando.gif\" /></p>");
  10. $.ajax({ type: "GET", url: "nav/buscar.php?cadena=" + c + "&ciudad=" + cd, cache: false, data: "", success: function(response){ r.html(response); $("#cadena").val("Nombre de la empresa o servicio"); $("#ciudad").val("Selecciona una ciudad"); } })
  11. }
  12. return false; // con este false cancelas el envio de datos y que recargue la pag
  13. })

por cierto... que les paso a los || en tu código? tambien se los pusiste y se los comio el foro? xD al parecer es un problema con la palabra ‭‬javascript otra vez... ya lo reporto para mientras usa java para el código xD


Título: Re: Evento onsubmit ‭‬‭‬javascript IE 8
Publicado por: naderST en 8 Febrero 2010, 23:39 pm
El código que me diste funciona pero caí en lo mismo porque igual no me esta funcionando en IE8 me recarga la página pero en chrome y ff va excelente

Amigo disculpa haberte hecho perder el tiempo  :( la solución fue descargar la ultima versión de jQuery ¬¬


Título: Re: Evento onsubmit javascript IE 8
Publicado por: Nakp en 9 Febrero 2010, 00:32 am
jajaja no importa... por lo menos dejarás de usar los eventos javascript incrustados


Título: Re: Evento onsubmit javascript IE 8
Publicado por: DesarrolladorWeb en 25 Marzo 2011, 20:14 pm
Creo que esta es la solución:

Me imagino que en el "head" de tu documento html tenés algo como esto:(Opción 1)

Código:
<script [size=14pt][i][b]type="text/javascript"[/b][/i][/size] src="aqui la ruta al archivo donde esta tu función buscar()"></script>

Ó podrías tener algo asi:(Opción 2)
Código:
<script [size=14pt][i][b]type="text/javascript"[/b][/i][/size]>
function buscar(){
   var c = $("#cadena").val();
   var cd = $("#ciudad").val();
   var r = $("#categorias");
 
   if(($.trim(c) == "") || ($.trim(cd) == "") || ($.trim(c) == "Nombre de la empresa o servicio")){
      alert('Debes colocar una empresa o servicio a buscar.');
   } else {
      r.html("<br /><p align=\"center\"><img src=\"images/cargando.gif\" /></p>");
      $.ajax({ type: "GET", url: "nav/buscar.php?cadena=" + c + "&ciudad=" + cd, cache: false, data: "", success: function(response){ r.html(response); $("#cadena").val("Nombre de la empresa o servicio"); $("#ciudad").val("Selecciona una ciudad"); } });
   }
}
</script>

Y en el formulario tenes esto:
Código:
<form name="buscar_form" id="buscar_form" onsubmit="buscar(); return false;">

Tanto la opción 1 cómo la opción 2 funcionan en IE 8.
Quiero que prestes atención al atributo "TYPE", que me he encargado de remarcarlo en las dos opciones (1 y 2). Este atributo debe tener el valor "text/javascript" y NO el valor "application/javascript". Pareciera que por algún motivo IE 8 ignora a los script del tipo "application/javascript" o existe algún tipo de error que desconozco, lo importante de todo esto es que este atributo tenga el valor "text/javascript" para que funcione correctamente.

No estoy seguro si es la solución a tu problema, pero a mi me paso lo mismo que a vos y lo solucioné de esta forma.

De todas formas hace bastante que está este tema...lo respondo para aportar a la comunidad...

Espero que a alguien le sirva....Saludos!!