Změna submit buttonu po odeslání v nette.ajax.js
- Higr
- Člen | 16
Potřeboval bych přijít na to, jak změnit vzhled submit buttonu při zpracovávání formuláře přes nette.ajax.js, na nějaký loading style. Až ajax doběhne, tak by se tlačítko změnilo zase do původní hodnoty. V javascriptu jsem zcela začátečník, věděl by mi někdo poradit s touhle fíčurou?
- Kamil Valenta
- Člen | 822
Jen pozor, „loading style“ je potřeba také odebrat v případě, že form bude nevalidní a zobrazí nějakou chybu. Aby bylo možné opravený form zase odeslat :)
- ic
- Člen | 430
@Higr
Bez znalosti JS to nebude jednoduché, jo a taky bez znalosti jQuery.
napřed bych si identifikoval tlačítko (tlačítka) na které chci funkci navěsit, například pomocí přidání class ‚efekt‘ po načtení celého dokumentu pak na ně script zavěsí js efekt něčím, jako toto:
[ ...document.querySelectorAll( '.efekt' ) ].forEach( ( /** @type {HTMLElement} */ item ) =>
{
item.addEventListener( 'click', (event) =>
{
event.target.classList.add( 'kliknuto' );
}, false )
} );a po načtení nette scriptů se dá dokončení ajaxového požadavku detekovat pomocí něčeho jako :
$.nette.ext( "ajaxRedirect", {
complete: function ( payload, status, nette )
{
// … kód zde … kliknuté tlačítko bude v nette.nette.el, takže třeba nette.nette.el.classList.remove('kliknuto');
}
} );a + různé chybové stavy pro případ, že kliknuto sice je, ale formulář je nevadlidní a tak se neodešle, nebo se odešle a ze serveru vrátí chyba, …
Editoval ic (19. 7. 2019 13:15)