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
<form name="buscar_form" id="buscar_form" onsubmit="buscar(); return false;">
Function buscar()
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"); } });
}
}
No se sí me expliqué bien pero estoy apunto de poner un botón con un onnlick="buscar();" y dejarlo así
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
$('#buscar_form').submit(function(){
//agrega tu codigo aqui
});
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
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)
var c = $("#cadena").val().trim();
var cd = $("#ciudad").val().trim();
y agrega PUNTO Y COMA al final de la definicion de variables :xD
Nada ahora no me tira error pero en IE8 simplemente recarga la página estoy haciendo esto:
$("#buscar_form").submit(function(){ return buscar(); });
buscar retorna false pero algo curioso es que si lo pongo así:
$("#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
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:
$('#buscar_form').submit(function(){
var c = $("#cadena").val().trim();
var cd = $("#ciudad").val().trim();
var r = $("#categorias");
if((c == "") || (cd == "") || (c == "Nombre de la empresa o servicio")){
alert('Debes colocar una empresa o servicio a buscar.');
} else {
r.html("<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"); } })
}
return false; // con este false cancelas el envio de datos y que recargue la pag
})
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
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 ¬¬
jajaja no importa... por lo menos dejarás de usar los eventos javascript incrustados
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)
<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)
<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:
<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!!