AJAX Snippet se po select onchange překreslí jenom jednou

kachna96

Zdravím,

řeším problém s formulářem na editaci údajů, kde si administrátor může přepínat mezi jednotlivými uživateli pomocí select boxu. Potíž je, že se formulář překreslí pouze jednou, poté už na změnu v select boxu nereaguje.
Překreslování formu řeším přes AJAX a Snippety.

Presenter:

public function handleNameChange($id) {
    $record = $this->userManager->getRecordById($id);
    if(!$record){
        $this->error("An error occurred while retrieving information from database, please contact administrators about this.");
    }
    $this->avatar = $record->avatar;
    $this['editWriterProfileForm']->setDefaults($record);
    $this['editWriterProfileForm']['users']->setDefaultValue($id);

    if ($this->isAjax()) {
        $this->redrawControl('editProfile');
    } else {
        $this->redirect('this');
    }
}

Latte:

{block content}
    <h1 n:block=title>Admin settings</h1>

    <h2>Edit profile</h2>
    {snippet editProfile}
        {control editWriterProfileForm}
    {/snippet}

    {include jsCallback, users => users, link => nameChange}
{/block}

JS:

{block jsCallback}
    <script>
        $('#' + {$control["editWriterProfileForm"][$users]->htmlId}).off('change').on('change', function() {
            $.nette.ajax({
                type: 'GET',
                url: {link {$link}!},
                data: {
                    'id': $(this).val()
                }
            });
        });

    </script>
{/block}

Mohl by mi prosím někdo pomoct?
Omlouvám se pokud je řešení zřejmé, ale s AJAXem teprve začínám a Google mi nepomohl.

dms

Ahoj, problém je v javascriptu. Událost se ti nabinduje při načtení stránky na html select (to je ok). Nette pak díky ajax snippetu vyhodí aktuální html s formulářem a nahradí ho novým html, které už ale nemá nabindovanou událost na změnu selectu. Řešení třeba tady https://forum.nette.org/…u-s-js-prvky

kachna96

Díky! Už mi to funguje.
Kdyby někoho zajímalo řešení, tak stačilo upravit script na:

{block jsCallback}
    <script>
        $(function(){
            $.nette.ext("initOnAjax", {
                success: function (payload) {
                    if (!payload.redirect) {
                        jsInit();
                    }
                }
            });
            jsInit();
        });
        function jsInit() {
            $('#' + {$control["editWriterProfileForm"][$users]->htmlId}).off('change').on('change', function() {
                $.nette.ajax({
                    type: 'GET',
                    url: {link {$link}!},
                    data: {
                        'id': $(this).val()
                    }
                });
            });
        }
    </script>
{/block}