ublaboo/datagrid – Proč se refreshuje celá stránka po zadání vstupu do filtru?

Bogi

Rozjel jsem si ublaboo datagrid a učím se s ním trochu dělat, ale setkal jsem se s divnou chybou, která bude nejspíš problémem někde u mě. Když píšu text do nějakého textového filtru pro filtrování řádků, po každém napsaném znaku se refreshuje celá stránka, což samozřejmě taky vyhodí kurzor z daného inputu, kam píšu to, co chci vyfiltrovat. Chyba je nejspíš někde v tom, že se datagrid neaktualizuje ajaxem, ale překreslí se komplet celá stránka.

Takto vypadá vytvoření komponenty:

	public function createComponentSimpleGrid($name)
	{
		$grid = new DataGrid($this, $name);

		$grid->setDataSource($this->db->table('users'));
		$grid->addColumnText('login', 'Login');

		$grid->addColumnText('password', 'heslo');
		$grid->addColumnText('role', 'role');

		$grid->addFilterText('login', 'Login');
	}

A takto vykreslení do šablony (v hlavičce mám linky na všechny assety nainstalované bowerem a všechny fungují):

<h1>Datagrid</h1>
{control simpleGrid, 'mujGrid'}

Čím by to mohlo být a jak to napravit?

P.S. Datagrid se mi jinak zdá naprosto luxusní! :)

Editoval Bogi (16. 3. 2016 2:21)

premek_k

Máš tam přilinkovaný nette.ajax.js a nezapoměl jsi na jeho inicializaci?

	<script>
	    $.nette.init();
	</script>

Editoval premek_k (16. 3. 2016 8:37)

Bogi

Ano, nette.ajax.js je přilinkovaný a dosažitelný a poté mám jeho inicializaci. Veškerý javascript proběhne bez chyby, nebo tedy nikde nevyskočí žádná chyba..
Nezapomněl jsem ještě přidal něco, co by ten datagrid zaplo do ajaxového režimu? Mám to nastavené tak, jak je uvedeno v příkladech na oficiální stránce

Pavel Janda

@Bogi Zkus napsat do stránky <a href="/" class="ajax">click</a>. Potom na to klikni. Co se stane? Refreshne se ti stránka, nebo se nic nezmění – ani se nenačte stránka? Přidá to v chrome developer tools xhr request? – Tímhle nejprve ověříme funkčnost nette.ajax.js.

Bogi

@PavelJanda @premek_k Máte pravdu, něco musí být špatně s ajaxem. Jsem z toho vážně jelen :D
Po přidání <a href="/" class="ajax">click</a> a kliknutí na něj se provede refresh celé stránky. Zkontroloval jsem XHR request v Chromu a žádná XHR request se negeneruje. V jiných prohlížečích je chování stejné. Osekal jsem celou stránku už jenom na úplný základ, pouze přidání jquery, přidání nette.ajax.js a inicializace. Zdá se, že se vše inicializuje, v Console není žádná chybová hláška, všechno v pořádku. Když vyzkouším třeba to, že zakomentuju nette.ajax.js nebo jquery, tak samozřejmě dostávám chybovou hlášku.

<!DOCTYPE html>
<html lang="cs">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link href="/favicon.ico" rel="icon" type="image/x-icon">

    <script src="/is/bower/bower_components/jquery/dist/jquery.js"></script>
    <script src="/is/bower/bower_components/nette.ajax.js/nette.ajax.js"></script>
    <script>
//        alert("This works");
        $.nette.init();
//        alert("This also works");
    </script>

</head>

<body>
    <a href="." class="ajax">click</a>
</body>
</html>

premek_k

Problém je s tou inicializací. Zkus to iniciovat dle doporučení autora, takto mi to chodí, kdežto tvůj způsob také ne.

		<script>
			$(function () {
				$.nette.init();
			});
		</script>

Pavel Janda

Jistě. Musíš to inicializovat až po načtení DOMu.

premek_k

@PavelJanda možná by to chtělo upravit v popisu datagridu

Pavel Janda

@premek_k Pravda, zmínka by tam ze slušnosti měla být. Připíšu.

Bogi

Pánové, děkuji! Ajax funguje a ublaboo datagrid krásně ožil!