jak navazat ajax spinner na dependent select pomoci nette.ajax.js

pp

Zdravim, snazim se na prvni aplikaci seznamit s nette a ajaxem. Mam formular se tremi zavislymi selecty (vyber obec, ulice, cp). Inspiroval jsem se http://zlml.cz/…t-select-box – toto mi funguje. Navazal jsem nette.ajax.js v defaultnim nastaveni. Coz mi sice zaajaxovalo odkazy a spinner se zobrazuje pri kliknuti na select ale ja bych potreboval aby se zobrazil (nejlepe i spravne pozicoval) hned po vyberu polozky a schoval se az DB vrati data.
Poprosil bych o radu, pokud mozno polopate nejlepe s kodem – jeste v ajaxu hodne plavu. Dekuju

David Matějka

A co pouzivas za spinner? ten z nette.ajax by se mel chovat spravne, jak ocekavas

pp

v @layout.latte mam

<script src="{$basePath}/js/jquery-2.1.4.min.js"></script>
<script src="{$basePath}/js/netteForms.js"></script>
<script src="{$basePath}/js/nette.ajax.js"></script>
<script src="{$basePath}/js/spinner.ajax.js"></script>
<script src="{$basePath}/js/main.js"></script>

v main.js

$(function(){
    $.nette.init();
});

puvodni nette.ajax.js verze 1.2.2

v spinner.ajax.js

(function ($, undefined) {
    $.nette.ext('spinner', {
        init: function (x) {
            this.spinner = this.createSpinner();
            this.spinner.appendTo('body');
        },
        start: function (jqXHR, settings) {
            this.spinner.css({
            position: "absolute",
            left: settings.nette.e.pageX,
            top: settings.nette.e.pageY
            });
            this.spinner.show(this.speed);
        },
        complete: function () {
            this.spinner.hide(this.speed);
        }
    }, {
        createSpinner: function () {
            var spinner = $('<div>', {
                id: 'ajax-spinner',
                css: {
                    display: 'none'
                }
            });
            return spinner;
        },
        spinner: null,
        speed: undefined
    });
})(jQuery);

v sablone pak

{define #content}

{form formNew class => ajax}
    {label first /} {input first class => ajax}
    {snippet secondSnippet}
        {label second /} {input second class => ajax}
        {snippet thirdSnippet}
            {label third /} {input third class => ajax}
        {/snippet}
        {include #js}
    {/snippet}
    {input send}
{/form}

{/define}

{define #js}

<script type="text/javascript">
  {include #jsCallback, input => first, link => firstChange}
  {include #jsCallback2, input => second, link => secondChange}
</script>

{/define}

{define #jsCallback}
$('#{$control["formNew"][$input]->htmlId}').on('change', function() {
    $.nette.ajax({
        type: 'GET',
        url: '{link {$link}!}',
        data: {
            'value': $(this).val(),
        }
    });
});
{/define}


{define #jsCallback2}
$('#{$control["formNew"][$input]->htmlId}')
        .on('change', function() {
            $.nette.ajax({
                type: 'GET',
                url: '{link {$link}!}',
                data: {
                    'value2': $(this).val(),
                    'value1': $('#{$control["formNew"]["first"]->htmlId}').val(),
                },
                success: function(){
                    $("#formNew").css("background-color", "red");
                },
            })
         });
{/define}

pp

tak v debuggeru FF mi na akci onchange hlasi chybu

settings.nette is undefined v spinner.ajax.js (sekce start:)

co tam mam blbe ?