Submit input s Ajaxovým spinnerem

Upozornění: Tohle vlákno je hodně staré a informace nemusí být platné pro současné Nette.
worsik
Člen | 40
+
0
-

Ahoj,

hledal jsem a nenašel, takže se ptám :o)
Mám formulář pouze s tlačítky „ano“ a „ne“.
Tento formulář zobrazuji pro potvrzení importu dat z importních souborů do DB.
Protože ale handler, který obsluhuje formulář trvá díky načítání souborů strašně dlouho (ukládá třeba 1600 záznamů z 15ti souborů), chtěl bych zobrazit spinner, který uživateli řekne, že se pořád něco děje a který po načtení stránky zmizí.
Našel jsem od Davida řešení pro odkazy (<a>)

<script>
$(function() {
        // nastaví událost onclick pro všechny elementy A s třídou 'ajax'
        $("a.ajax").live("click", function(event) {
                $.get(this.href); // zahájí AJAXový požadavek

                // zobrazí spinner, signalizující uživateli, že se něco děje
                $('<div id="ajax-spinner"></div>').css({
                        position: "absolute",
                        left: event.pageX + 20,
                        top: event.pageY + 40

                }).ajaxStop(function() {
                        $(this).remove(); // po skončení spinner smaž

                }).appendTo("body");

                return false;
        });
});
</script>

, ale narazil jsem na pár maličkostí.

  • mám dvě tlačítka submit, tedy neřeším $form->onSubmit[], ale $form[‚ano‘]->onClick[] a $form[‚ne‘]->onClick[]. Když pak navěsím ajaxem spinner přes onClick, přepíšu volání handleru. Spinner se zobrazí, ale form se neodešle.

Je možnost, jak navěsit zobrazení spinneru, provést handler formuláře a pak spinner zase odstranit?
Nejsem moc velký JavaScripter :o)

Ideální by bylo, kdyby se zobrazení spinneru dalo navěsit na jinou událost, která se taky děje při onclick. Pak by se snad provedl i onClick handler a dalo by se postupovat jako u odkazu <a>