Envio de formulario con js no intrusivo

[Harris]

Buenas a tod@s, estoy intentando crear unos formularios gestionados con js y ajax pero de forma no intrusiva.
Es decir, lo que quiero es que si el usuario tiene activado el js al pulsar sobre el submit llamará a la función enviar_por_ajax. Si el usuario no tiene js el formulario se enviará a la pagina_destino.php

Código HTML:

<form method="post" action="pagina_destino.php">
<input type="submit" onclick="javascript:enviar_por_ajax()" >
</form> 

El problema es que ahora si el usuario si tiene js, se ejecuta el ajax y luego se envía a pagina_destino, se hace lo mismo dos veces. Lo que quiero es que la propia función enviar_por_ajax envíe la información y evite el envío a pagina_destino. También me vale cualquier otra solución.

Por favor decidme a ver qué se os ocurre, muchas gracias

[SergeMedina]

Lo que yo he hecho es:
1. Hacer los formularios para que funcionen mediante la forma tradicional. Sin onclicks ni cosas parecidas.
2. Agregarle una clase especial a los elementos que interaccionan con javascript. Ejemplo: "ajax";
3. Cuando el DOM este listo, ejecutar una funcion para agregar eventos a los elementos que tengan la clase especial :

Código javascript:

//uso jquery como framework
$(document).ready(function(){
   $('buttonSubmit.ajax').click(function(){
           $.ajax();
           return false;
    })
//si son links
 
$("a.ajax").each(function(){
        h = $(this).attr("href");
        $(this).attr("href", "#");
        $(this).attr("rel",h);
        $(this).removeClass("ajax").addClass("ajax-ready").click(function(){
                  $.ajax()
         });
    });
});
 

La idea es identificar que elementos interactuan mediante ajax con el servidor, para que mediante eventos gestiones su interaccion. Recuerda primero html, programacion servidor, programacion cliente.

Saludos.

[caricatos]

Hola:

El evento asociado al envío del formulario es submit, y como tal basta con enviarle el valor lógico false para evitar su envío, o sea, con una sola línea tendrías resuelto el problema...

<form method="post" action="pagina_destino.php" onsubmit="enviar_por_ajax(); return false">
<input type="submit" />
</form>

O si haces pocos retoques podría ser: onsubmit="return enviar_por_ajax()"... poniendo return false al final del envío por ajax... pero fuera del onreadystatechange()...

Saludos

[Harris]

Muchas gracias caricatos es justo lo que necesitaba.