Fare un "ajaxform" sul volo

Question

Sto cercando di usare ajaxForm sulla mia forma creata sul volo. In effetti, la mia applicazione produrrà un link "al volo" e facendo clic su quel collegamento, produrrà un ajaxForm (Ancora una volta sul volo da jQuery!), Quindi ho usato il .live() funzione con ajaxForm(). Questo è il mio sbagliato codice:

$('form').live('submit', function() {
    $(this).ajaxForm({dataType: 'html', success: function(data) {
        alert(data);
    }});
    return false; // For preventing page refresh!
});

Nel mio modulo, quando faccio clic sul pulsante Invia, la pagina si aggiorna.

C'è una soluzione?

Answer 1

Come altri hanno detto, il tuo return false dovrebbe funzionare.

Quindi, qualcos'altro non va. Assicurati che jQuery sia caricato correttamente e che il gestore on-sottopromito effettivamente esegui posizionando il codice di debug in esso.

Inoltre, assicurati di avere Firebug installato e abilitato (o equivalente per il tuo browser) in modo da poter eseguire il debug.

Answer 2

Prova a usare event.stopPropagation (); che è una funzione jQuery.

Per fare ciò dovrai portare l'oggetto evento come parametro sul gestore:

$('form').live('submit', function(event){

e usa questa linea al posto di return false; :

event.stopPropagation();

Answer 3

Il return false dovrebbe funzionare, ma è la migliore pratica event.preventDefault() o event.stopPropagation() Quando non hai bisogno di fare entrambe le cose. In questo caso sarebbe event.preventDefault() Perché si desidera interrompere l'azione predefinita di inviare il modulo. Ma come ho detto return false; Avrei dovuto lavorare nel tuo caso, quindi sospetta che potresti ottenere una sorta di errori con il plug -in che stai usando. Se fossi in te, vedrei di nuovo la documentazione per tuoPlugin e assicurarsi che le opzioni siano corrette. Proprio dal retro vedo un dataType: 'html' E può esserci solo 'xml', 'script', or 'json' Come indicato nella documentazione ... potresti voler dare un'altra occhiata al tuo utilizzo del plug -in.

Answer 4

Potrebbe essere necessario chiamare preventDefault Al posto di "Return False". Pseudo codice di quel caso d'uso di jQuery liveCon la forma combinata con AJAX è sotto:

    //Override form submit
    $("form").live("submit", function (event) {
        event.preventDefault();
        var form = $(this);
        $.ajax({
            url: form.attr('action'), // Get the action URL to send AJAX to
            type: "POST",
            data: form.serialize(), // get all form variables
            success: function(result){
                // ... do your AJAX post result
            }
        });
    });

Inoltre, non sono sicuro che con Ajaxform (poiché non ho usato Ajaxform) devi usare jQuery.live. Inferendo dal dottore, potresti non averne affatto bisogno.