nette.ajax.js – různé formuláře, různé zpracování

tomees

Ahoj, řeším toho teď ohledně ajaxu víc a dřív jsem ho moc nepoužíval, maximálně na drobnosti, proto teď více dotazů.

Je možné mít ve spojení s nette.ajax.js na stránce více formulářů a u každého mít např. jinou metodu success? Za předpokladu že všechny formuláře mají class „ajax“ mohu na základě něčeho toto u zpracování definovat?
Nebo musím pro každý formulář napsat komplet js na odesílání a na každý formulář to přidat zvlášť?

Jde mi o to, že po odeslání jednoho formuláře bych třeba rád překreslil nějaké snippety, při odeslání jiného bych třeba zase chtěl jen zavřít modal. Jak to udělat co nejlpépe / nejjednodušeji?

Díky za rady.

Šaman

Jasně že lze. Třída ajax jen řekne, že se to má zpracovat ajaxově. Ale zpracováni probíhá podle id formuláře. Tu třídu ajax chápej jen jako přepínač.

tomees

Jasně, tak nějak si to myslím. Ale kde definuji to zpracování pro konkrétní formulář např. s id formular1 a formular2? To je právě to co mi nejde do hlavy.
Když si definuji nějaké nové extension v nette.ajax.js tak se vždy provede pro všechny požadavky.

Šaman

Nechápu otázku. Formulář odladíš neajaxově. Jeho zpracování navěsíš na událost onSuccess, vše v PHP.
Někde ho vykreslíš v šabloně, to je latte.
Až nakonec ho obalíš snippetem, includneš jQuery a nette.ajax.js, který inicializuješ. Pak, když formuláři nastavíš třídu ajax, tak se odešle ajaxově.
Do obsluhy (opět v PHP) jen dopíšeš, že pokud isAjax(), tak chceš překreslit snippet namísto redirectu.

Jediný chyták je v tom, že je myslím potřeba přidat toto překreslení i do onValidate a onError. (Validate jen pokud máš vlastní validaci, ale do onError vždy, protože to může nastat kdykoliv).

her-ur

@tomees Myslíš zpracování v javascriptu a ne v PHP?

V nette ajax extension dostaneš v parametru ten element a musíš si zkontrolovat, jestli to je opravdu ten, který chceš. Např:

$.nette.ext('my-ext', {
    before: function (xhr, settings) {
        if (settings.hasOwnProperty('nette') && settings.nette.hasOwnProperty('el')) {
            var $el = settings.nette.el;
            if ($el.is('.css-class')) {
                this.runSuccess = true;
            }
        }
    },
    success: function (payload, status, jqXHR, settings) {
        if (this.runSuccess) {
            // ...
        }
    }
}, {
    runSuccess: false
});

majky358

@tomees

Niečo podobné ako @her-ur , aspoň ja som si napísal také riešenie, podobne možnosť vlastnej extension.

$("#myBtn").bind('onSuccess', function() {
    $("#myModal").modal('hide');
});

$.nette.ext({
    success: function (payload, status, jqXhr, settings) {
        var idSelector = "#" + settings.nette.el.context.id;
        $(idSelector).trigger('onSuccess');
    }
});

Update snippetov napriklad

if('snippets' in jqXhr) {
    var snippets = $.nette.ext('snippets');
    snippets.updateSnippets(jqXhr.snippets, false);
}