NasExt/DependentSelectBox – formulář mi neajaxuje :(

před 6 lety
Roman Halaxa
Člen | 60
+
0
-

Snažím se zprovoznit NasExt/DependentSelectBox

Můj problém:

  • Callback pro načtění dat se zavolá pouze když formulář otevřu (je modální) a dále pokud kliknu na submit. Při změnění hodnoty selectu na kterém je můj druhý select závislý se nic neděje.

Postupoval jsem dle dokumentace https://github.com/…doc/index.md

Přikládám jak mám zalinkovaný script pokud by byla chyba třeba v pořadí:

<script src="{$basePath}/js/jquery.js"></script>
<script src="{$basePath}/js/bootstrap.min.js"></script>
<script src="{$basePath}/js/netteForms.js"></script>
<script src="{$basePath}/js/nette.ajax.js"></script>

<script src="{$basePath}/js/happy.js"></script>
<script src="{$basePath}/js/bootstrap-datepicker.min.js"></script>
<script src="{$basePath}/js/bootstrap-datepicker.cs.min.js"></script>
<script src="{$basePath}/js/jquery-ui-sortable.js"></script>
<script src="{$basePath}/js/datagrid.js"></script>

<script src="{$basePath}/js/datagrid-instant-url-refresh.js"></script>

<script src="{$basePath}/js/datagrid-spinners.js"></script>
<script src="{$basePath}/js/main.js"></script>

<script src="{$basePath}/js/bootstrap-select.js"></script>

<script src="{$basePath}/js/dependentSelectBox.js"></script>

<!--  Bootstrap end  -->
<script>
//Initialize nette.ajax.js after loading the DOM.
    $.nette.init();
    $('[data-dependentselectbox]').dependentSelectBox();
</script>

Jak vidíte nette ajax inicializuji před inicializací samotného doplňku (alespoň doufám). Tento kód je hned nad koncem body. Tady bych ještě doplnil že v dokumentaci byl ještě callback jako parametr metody dependentSelectBox. To mi tam dělalo chybu a tak jsem to odebral, protože jsem v jiných příspěvcích viděl, že to tam ostatní taky nemají.

Doplněk mám zaregistrovaný v config neon:

extensions:
	dependentSelectBox: NasExt\Forms\DependentExtension

A ve formuláři to mám napsané takhle:

$form->addSelect('resource', $this->translator->translate('messages.resource'), $resourceNamesForSelect);

$form->addDependentSelectBox('task', $this->translator->translate('messages.task'), $form['resource'])
    ->setDependentCallback(function ($values) {
        $data = new DependentData;
        $data->setItems($this->taskRetrieverService->getTaskNamesByResource($values['resource']));
        return $data;
    });

Editoval Roman Halaxa (25. 1. 2019 9:59)

před 6 lety
Phalanx
Člen | 310
+
+1
-

Ahoj, když otevíráš dialog, musíš ještě znovu inicializovat DependentSelectBox.

<script type="text/javascript">
	$( document ).ready(function() {
		$(document.body).on('shown.bs.modal', function (e) {
			$('[data-dependentselectbox]').dependentSelectBox();
		});
	});
</script>
před 6 lety
Roman Halaxa
Člen | 60
+
+1
-

Phalanx napsal(a):

Ahoj, když otevíráš dialog, musíš ještě znovu inicializovat DependentSelectBox.

<script type="text/javascript">
	$( document ).ready(function() {
		$(document.body).on('shown.bs.modal', function (e) {
			$('[data-dependentselectbox]').dependentSelectBox();
		});
	});
</script>

To je ono. Na to bych upřímně nepřišel :) Ještě že jsem zmínil že je to modal. Děkuji pane !

EDIT:

Ještě přikládám jak to bylo fixnuto v mém konkrétním řešení

$.nette.ext("modals", {
    success: function(payload) {
        if (payload.hideModal) {
            $('.close').click();
        } else if(payload.showModal) {
            $('[data-dependentselectbox]').dependentSelectBox();
            $('.modal-ajax').modal({ fadeDuration: 1000});
        }
    }
});

Editoval Roman Halaxa (25. 1. 2019 10:48)