Vlastní JS script před a po odeslání AJAXu

Magnus

Ahoj,

je nějak možné vytvořit si vlastní JS script, který se vykoná před a po odeslání AJAX požadavku? Když mám na stránce dva (a více) formulářů, potřebuji vytvořit javascriptové zpracování pro oba zvlášť.
Používám doplněk nette.ajax.js, kde je metoda $.nette.ext(). Ta ale provede script při jakémkoliv odeslání. Já bych potřeboval, abych si určil, pro který formulář se provede který script.

Například:
<form name=„test1“></form>
<form name=„test2“></form>

<script type="text/javascript">

nazevFunkce("test1", {
	before: function() {
		// script po odeslání formuláře s atributem name="test1"
	},

	success: function(payload) {
		// script po odeslání formuláře s atributem name="test1"
	}
});

nazevFunkce("test2", {
	before: function() {
		// script po odeslání formuláře s atributem name="test2"
	},

	success: function(payload) {
		// script po odeslání formuláře s atributem name="test2"
	}
});

</script>

Mohl by mi někdo, prosím, poradit, jak na to?
Děkuji moc.

wb2009

Jenom otázka? Nešlo by to podchytit tak, že na on success funkci jednoho formu zavoláš jinou funkci co něco provede?

Př:
Vše bude jeden form, vyplní se hodnoty a ve funkci zpracovávající hodnoty budeš mít podmínku, podle které něco provedeš, nebo insertneš něco do databáze, získáš insertnuté id a pracuješ s ním dál…

Možná nám vysvětli co vlastně to má dělat :) Jinak vlastní skript si udělat můžeš, stačí upravit ty stávající, třeba pro jQuery a ajax..

Vojtěch Dobeš

S nette.ajax.js toho lze docílit poměrně snadno. Stačí formulářům nedávat třídu ajax, a oajaxovat si je sám:

$.nette.ext('test1', {
	load: function () {
		$('form[name="test1"]').off('submit.test1').on('submit.test1', function (e) {
			$(this).netteAjax(e).before(function () {
				...
			}).done(function (payload) {
				...
			});
		});
	}
});

Magnus

Děkuji za odpovědi. Nicméně ten script mi hlásí chybu, že objekt nemá metodu „before“. Zkoušel jsem i „beforeSend“, ale to taktéž nefungovalo. Mohl bych poprosit ještě jednou o přezkoumání? :-)

Vojtěch Dobeš

Omlouvám se, moje nepozornost :). Musí to být takto:

$.nette.ext('test1', {
	load: function () {
		$('form[name="test1"]').off('submit.test1').on('submit.test1', function (e) {
			$(this).netteAjax(e, {
				beforeSend: function () {
					...
				}
			}).done(function (payload) {
				...
			});
		});
	}
});

Magnus

Výborně, takhle to již funguje, děkuji. :-)

Jen ještě nemohu přijít na to, jak to zkombinovat s netteForms, když se automaticky validují formuláře, protože se metoda beforeSend() zavolá nezávisle na tom, jestli je formulář validní. Předpokládám, že by šlo udělat kontrolu před voláním metody $(this).netteAjax() a v případě neúspěchu vrátit FALSE, aby se AJAX neodeslal. Nicméně to samotná knihovna netteForms neumožňuje, tak se chci zeptat, zda k tomu existuje již napsaná verze, nebo si ji mám napsat sám?
Pokud tedy neexistuje ještě efektivnější řešení.

Vojtěch Dobeš

Shit, díky za upozornění, uvědomil jsem si, že before je jediná událost, kde konkrétně předaný callback je volaný dřív než obecně registrovaná extension. Upravím to v masteru (bude to BC break) – potom už se manuálně předaný beforeSend zavolá až pokud formulářová validace projde.

Vojtěch Dobeš

Done: https://github.com/…d1d70d8bcbc3.

Magnus

Super, už to funguje, díky, jste frajer. :-)

Jen je tu možná ještě jeden malý problém – formulář se validuje 2×. Když například nevyplním některé pole, alert se vyhodí dvakrát.

Vojtěch Dobeš

Hm, mohu poprosit o kompletní JS kód?

Magnus

Omlouvám se za časovou prodlevu, k PC jsem se dostal až teď.

Zde jsou uvedené scripty:
nette.ajax.js: http://pastebin.com/UAkQuiT6
Šablona – přihlašovací stránka: http://pastebin.com/VbQM6s63
Formulář pro přihlášení: http://pastebin.com/AWWFeBbH

Metody showAjaxSpinner(), hideAjaxSpinner() a deactivateButton() jen upravují CSS, odeslání AJAXu tudíž nemohou nijak pozměnit.

Je možné, že jsem něco špatně pochopil a podle toho to špatně napsal?

Editoval Magnus (6. 6. 2013 20:40)

Vojtěch Dobeš

Magnus: A invaliduje se dvakrát hned po prvním načtení stránky, nebo až ve snippetu přenačtený formulář, nebo oboje? Netřeba se omlouvat :).

Editoval vojtech.dobes (7. 6. 2013 0:40)

Magnus

Formulář se invaliduje jak při prvním načtením stránky, tak i ve snippetu, když se formulář načte znovu. Soukromě bych mohl poslat více kódu, pokud by bylo potřeba.

Magnus

Prosím, nevěděl by někdo, jak to vyřešit? Nechci Vojtěchovi zasahovat do scriptu. Omlouvám se za double post, ale je to již delší dobu neaktivní a myslím si, že nejsem jediný, kdo má tento problém.

Díky moc.