„Too much recursion“ při odesílání formuláře

Pokud narazíte na chybu „Too much recursion“ (a nebo prostě prohlížeč spadne) při odesílání formuláře, podívejte se po metodě, která odesílání zajišťuje.

Na první pohled nemusí být nic zřejmé:

//...
window.checkValid = function(form) {
    form = $(form);
    if (form.validate()) {
        form.submit();
    }
}

Při kliknutí zkontrolujete validitu formuláře a pokud je validní, formulář odešlete. Celkem běžný postup.

Problém ale spočívá v tom, že jQuery methoda $(form).submit() neodesílá formulář, nýbrž vytváří událost submit (podobně jako metoda $(button).click() vytvoří událost click) a tudíž dojde k zavolání methody onsubmit – která pak znovu a znovu vytváří událost submit a zacyklí se.

Oprava tedy spočívá v tom pro skutečné odeslání formuláře použít původní DOM methodu form.submit().

window.checkValid = function(form) {
    if ($(form).validate()) { //jQuery
        form.submit();        //HTML (DOM)
    }
}

Případně, pokud již máte jQuery wrapper:

window.checkValid = function($form) {
    $form = $($form);
    if ($form.validate()) {
        $form[0].submit();
    //  $form.get(0).submit(); //alternativně
    }
}

A nebo pokud se nebojíte špinit si ruce s pořádným OOP:

window.checkValid = function(form) {
    var newForm;

    if ($(form).validate()) {
        //jQuery:
        newForm = $('<form>')[0];
        //vanilla JS:
        newForm = document.createElement('form');
        newForm.submit.call(form);
    }
}

Tenhle poslední příklad budete muset použít v případě, že někdo chytře pojmenoval odesílací tlačítko submit a pak vlastnost form.submit odkazuje na tlačítko místo původní metody.

Napsat komentář

Vaše emailová adresa nebude zveřejněna. Vyžadované informace jsou označeny *

Tato stránka používá Akismet k omezení spamu. Podívejte se, jak vaše data z komentářů zpracováváme..