Nový Nette DataGrid pro Bootstrap s možností vypsat strom

tom napsal(a):

Jestli to chápu správně, tak výsledkem každého handleru navázaného na Row selection je ajaxový request.

Potřebuju pomocí handleru stáhnout soubor, je možné nastavit aby se nejednalo o ajaxový request ale klasický? Pokud ne, tak kde se dá modifikovat ajax (a jak) tady toho gridu aby pro tento případ vykonal ještě otevření stránky, která to stažení souboru udělá?

Díky moc

Připravuji verzi 2.0. Každým dnem jí zveřejním (ještě nevím přesně kdy, dodělávám dokumentaci a testuji kvůli případným chybám).

Tam to bude takto, vše bude našeptávat. Do callbacku například activeSelected přijde jeden argument. Bude to pole a bude obsahovat vybrané řádky. Název linku a text pro confirm bude překládaný uživatelským překladačem.

$selection = $grid->enableRowSelection();

$selection->addLink('Active')
	->onCall[] = $this->activeSelected;

$selection->addLink('Unactive')
	->setAjax(FALSE) // tady vypneš AJAX
	->onCall[] = $this->unactiveSelected;

$selection->addLink('Delete')
	->setConfirm('Really delete all selected users?')
	->onCall[] = $this->deleteSelected;

Narazil jsem na neprijemnou vec u razeni – ordering.

Pouzivam

• Grid ve verzi 1.4.5
• jquery.nette.js
• jquery-2.1.3.min.js

Kdyz si kliknu na order nejakeho sloupce a divam se do vypisu Firebugu na na GETy, tak na poprve se provede jeden to je OK. Pri dalsim kliknuti se uz provedou 2, pro dalsim 4, pak 8, 16 atd …

V gridu nenastavuji zadny order, vse nechavam defaultni.

Cim by to mohlo byt?

tom napsal(a):

OK super, budu se tesit

mesour napsal(a):
Připravuji verzi 2.0. Každým dnem jí zveřejním (ještě nevím přesně kdy, dodělávám dokumentaci a testuji kvůli případným chybám).

Verze 2.0 už je hotová v branchi devel. Ještě dokončuji tu dokumentaci :-) A pak hned z dev-master udělám 1.4.5, udělám pull reguest a mergnu devel s materem a udělám release 2.0.0 :-)

Je možné, že v branchi devel budu dělat nějaké malé změny, ale většina je hotová :-)

Editoval mesour (16. 1. 2015 0:11)

Ahoj, ze zvědavosti jsem se podíval na demo a zamrzá mi ve Firefoxu verze 35. Přestává reagovat script. Asi je něco špatně…

mesour napsal(a):

Siam napsal(a):

Ahoj, ze zvědavosti jsem se podíval na demo a zamrzá mi ve Firefoxu verze 35. Přestává reagovat script. Asi je něco špatně…

Aha a víš při jaké akci se to děje? Hodilo by se mi více info pro simulaci.

EDIT: Aha právě jsem na to koukl chyba je hned po doc.ready a když to otevřu v debuggeru, tak to zůstane na nějaké řádce v jquery.js to je divné, asi se zbláznil debugger. Přes víkend se na to podívám a zjistím čím to je ;-)

Tak jsem na to přišel rovnou hned. Je to tím pluginem pro zobrazování řádků kódu, takže to není nic v gridu, ale pouze v demu. Tím pádem stránky basic, full, tree a settings zatím nebudou ve FF fungovat. Ten plugin upravím nebo ho zatím odstraním, ale dostanu se k tomu až během víkendu.

Díky za report :-)

Editoval mesour (17. 1. 2015 1:20)

Můžu se zeptat, kdy by mohla být venku verze 2.0? Dívám se na ni v devel, ale když ji použiju, tak mi přestane fungovat DibiDataSource (nevrací žádné data) tak si raději počkám i na tu dokumentaci.

Dík

Konečně jsem se dostal ke zveřejnění verze 2.0.0. Je k ní hotová dokumentace a dá se přepínat mezi starou a novou verzí. Je tam hodně změn a API není zpětně kompatibilní.

Tady je seznam hlavních změn:

1. Vše je zanořené v namespace \Mesour\DataGrid\… dříve pouze \DataGrid\…
2. Metoda column byla z gridu odstraněna a nahradily jí metody addText, addDate atd. První parametr je vždy ID sloupce a druhý nepovinný je text hlavičky. Jediný metoda addActions pro buttony má pouze jeden parametr text hlavičky.
3. Byl odstraněn sloupec Button a DropDown. Pro button a dropdowny přibyl sloupec Actions s metodami addButton a addDropDown.
4. Byla změněna inicializace Row selection. Nyní je celá objektová a nastavují se pouze callbacky místo přímých linků a také přibyla metoda na vypnutí AJAXu: http://grid.mesour.com/…c/selection/#…
5. DataSource se již neposílá v constructoru gridu, ale přibyla metoda setDataSource, takže vytvoření instance gridu požaduje IComponent a name, jako jiné Nette componenty.
6. Primary key se už nenastavuje na gridu, ale pouze na DataSource a je povinný ho vždy nastavit.
7. Status button je nyní poděděný od Buttonu, takže není potřeba dělat instanci button a nastavovat ji pro StatusButton
8. Metoda setPagerLimit byla odstraněna a limit itemů na stránku je nyní prvním parametrem metody enablePager
9. Pro přidání sloupců se používají metody začínající add a na zapnutí rozšíření metody začínající enable.
10. Přibyl sloupec Container. Nyní je možné dát více sloupců do jednoho <td>, například tímto způsobem spojit jméno a příjmení (lepší pokud je použita inline editace).

Tohle jsou asi nejdůležitější změny. V dohledné době mám v plánu přidat API reference a repozitář se sandboxem. Budou to zdrojáky dokumentace/dema. Ohledně dalšího vývoje a plánovaných novinek se zmíním na přednášce 31.1.

Phalanx napsal(a):

Ahoj, chtěl bych poděkovat za parádní doplněk. Ovšem mám k němu i menší kritiku a současně prosím o radu – při práci s vyšším objemem dat (nyní 25 000 záznamů v tabulce) už se mi stránka načítá 10–20 sekund na localhostu (bez doplňku max 0,5s). Mohl by mi někdo prosím poradit jak pracovat s vyšším objemem dat? Potřeboval bych mapovat stotisíce až miliony záznamů z databáze.

Moje postřehy:

1. vyřadil jsem standartní js filtr kvůli objemu dat do html a udělám si vlastní ve formuláři
2. Nevím jestli na tom nějak záleží, ale používám DibiDataSource pro připojení dat
3. Docela často se mi stává, že javascript problikává mezi dvěma stránkama…

Pro ty co mají problém s exportem csv v češtině jsem si udělal metodu

	private function fixEncoding($data) {
		return mb_convert_encoding($data, "ISO-8859-2", "UTF-8");
	}

kterou pak volám na všechen výstup, např.

	$header_arr[] = $this->fixEncoding($column->getText());
	$header_arr[] = $this->fixEncoding(reset($column));
	$header_arr[] = $this->fixEncoding($column);

atd. atd.

Ahoj, právě jsem to otestoval a skutečně DibiDataSource je pomalá. Optimalizoval jsem co šlo a dostal jsem se na 1/3 původního času (vlastně jsem se dostal ± na čas, za který to vyřídí čistá Dibi bez zaobalení v Gridovém DataSourcu).

Stejně ale na tabulce s 2,7m záznamy to trvá kolem 3 sekund. Oproti tomu NetteDbDataSource to trvá pouze 50ms. Přes víkend jsem dělal na Gridu nějaké změny, kouknu ještě na to kódování v exportu, hodím to do Gitu a udělám z toho verzi 2.0.3.

Používáte už nový Grid 2.0+? Pokud ne, tak ty optimalizované DataSourcy budu dávat i do starší verze a udělám 1.4.6.

Při tolika záznamech, ještě když jsou různorodé určitě použít vlastní filtr. Plánuji pak na default filtr dát omezení, že se při určitém počtu unikátních záznamů nezobrazí checkboxy.

@Phalanx Co se týče toho JavaScriptu. Co přesně myslíte tím problikáváním mezi dvěma stránkami?

K updatu bych se měl dostat ještě dnes. Nechci ale nic slibovat, kdybych to náhodou nestihl. Ale během následujících pár dní s tím můžete počítat. Případně mohu poslat optimalizované soubory na mail, abyste si to mohl zatím nahradit než proběhne update.

Editoval mesour (3. 2. 2015 13:13)

Phalanx napsal(a):

@mesour tak to je paráda, takovou reakci jsem vůbec nečekal. Mockrát děkuji. Ano, zatím testuji nejnovější Grid a pokud bude použitelný i s miliony záznamů, nemám vůbec co řešit a zrovna ho nasadím na aplikace.

ad problikávání: Projevuje se mi v ajaxových požadavcích. Řekněme, že kliknu například na seřazení sloupce, pak něco jiného, pak třeba na jinou stránku v paginatoru. Ajaxově načítaný obsah se mezi sebou začne bít (tj. problíkávat). Jednou naskočí výsledek, pak zpětné hodnoty, pak výsledek a takhle se to opakuje.

Když se dívám do chrome konzole v sekci síť, klepnutím na jediné tlačítko se mi jakoby násobí počet requestů. Nyní třeba z 375 → 539 → 742 → 984

Jak jsem psal zde: https://forum.nette.org/…vypsat-strom?p=6 Tak už jsem tohle řešil a vyřešil jsem to. Je to divné na demu to normálně funguje. Případně jsem už udělal sandbox, takže zde: composer create-project mesour/datagrid-sandbox. Tam mi to také funguje a nic se necyklí.

Ano, omlouvám se. Na jednom projektu jsem použil ještě verzi 1.4.5 a tam mi to právě dělalo. Budu se těšit na verzi 2.0.3 a po vydání si to přepíšu. Mockrát díky! :)

Velké díky patří vám všem třem.
Do teď to byl velmi nadprůměrný vynikající grid.
Ale přidáním subGridů se vyšvihl do galaktických výšin.
Hodně dobrá práce chlapci.
Už se těším na víkend jak ho začnu zkoušet.

Pokud by na video někdo nenarazil jinde, tak tady je video z Posoboty 31.1.2015 youtu.be, kde jsem představoval Mesour DataGrid.

Přemýšlím nad další přednáškou už trochu podrobnější a zajímavější, ale bude to nejdřív tak koncem první poloviny roku.

Editoval mesour (14. 2. 2015 1:58)

FJP napsal(a):

mpis napsal(a):

mesour napsal(a):
Jak to myslíš pošleš rovnou do excelu? Export je do CSV, takže je z toho pak nutné excel udělat. Export přímo do excelu dělat nebudu, protože bych musel dávat součástí gridu nějakou PHP knihovnu pro práci s excelem a ty bývají opravdu velké a přeobjektované.

Už vím přesně, jak to je.
Porovnávám dva gridy – Grido grid a Mesour grid.
A rozdíl je ve formátu a kódování výstupních souborů.
Mesour má UTF8 a oddělovač čárku, a pak to dělá to co jsem popisoval.
Grido má unicode (dva byty na znak) a oddělovač tabulátor. Takže když ho otevřu přímo v excelu, tak je to hned správně bez meziukládání souboru.
A tím „pošleš rovnou do excelu“ myslím to, že když dám export, tak se zobrazí dialog prohlížeče, kde se ptá, zda otevřít v excelu nebo uložit.

Ahoj, hlásím se k nepříjemnosti s nutností „meziukládání“, aby to excel přelouskal (nejdřív export otevřít př. v Notepadu a pak při ukládání nastavit kódování) – lze to nějak vyřešit?

Jinak možnost

$grid->enableExport(__DIR__ . '/../../temp/cache', null, array(), ";");

pomohla v tom, že se data nenacpou do jednoho sloupce, problém mi dělá už jen to kódování.

Ahoj, Phalanx dělal v exportu nějaké úpravy právě kvůli Excelu. V nejbližší době vytvořím novou release a v ní to už bude zapracované :-)

Tak verze 2.0.4 je venku :-)

Změny:

• Úplně se změnila inicializace DropDownu: http://grid.mesour.com/…ts/dropdown/
• Na každém sloupci přibyl event onRender, který je volaný před vykreslením každé buňky, takže je možné přidat na buňce například classu podle dat daného řádku. Ale pozor na to, že existuje pouze jedna instance sloupce, takže když se nastaví class=„xxx“ na řádku, kde je amount > 10, tak na ostatních amount <= 10 se musí zase zrušit.
• Fix UTF-8 pro Excel od @Phalanx – díky za pull request :-)
• Metoda addAttribute je deprecated, jak na sloupcích, tak na buttonech. Nahradila ji medota setAttribute.
• Metoda addActions na gridu a na containeru má nyní parametr header povinný.

DŮLEŽITÉ: Díky změnám v DropDownu a změně metody addActions vzniknul BC break, tak na to pozor! Tohle byla výjimečná situace, kdy nebyla možnost, jak to udržet zpětně kompatibilní pouze s deprecated, v budoucnu by se takovéhle změny měly zavádět minimálně.

Také jsem přidal donor list: http://grid.mesour.com/…ion2/donors/. Pokud bude někdo posílat donate a bude chtít ke jménu také link, tak prosím pište přes kontaktní formulář zde: http://mesour.com/contact/

Díky všem, kteří poslali příspěvek na vývoj :-)

Editoval mesour (23. 2. 2015 9:13)

Po stazeni sandboxu a nahrani demo DB:

Warning

Missing argument 1 for Mesour\DataGrid\Column\Container::addActions(), called in C:\EasyPHP\data\localweb\mesour\app\presenters\FullPresenter.php on line 108 and defined

Beton napsal(a):

Full functionality demo Hází pětikilo.

Díky za report. Zřejmě jsem zapomněl na update presenteru toho dema, už je to opravené :-)

Phalanx napsal(a):

@FJP Jestli se ti nechce(nemůžeš) čekat na novou verzi, mrkni sem – https://github.com/…ull/19/files

stačí přidat jeden řádek do Export.php za $file = fopen..

<?php
fputs($file, chr(0xEF) . chr(0xBB) . chr(0xBF)); // add BOM to fix UTF-8 in Excel
?>

Výborně, díky :)

FJP napsal(a):

Čauko,
myslím, že tady je chyba v dokumentaci: http://grid.mesour.com/…abase-table/

Nepřebývá tam „$presenter“ … ?

$grid = new \Mesour\DataGrid\Grid($source, $presenter, $name);

Koukal jsem se i do API (http://apis.mesour.com/…sicGrid.html#…) a v konstruktoru jsou jen dva parametry.

Ahoj, díky za info, už je to opravené :-) Přebýval tam source, ten se nyní posílá přes metodu setDataSource.

• Taky jsem aktualizoval API pro 2.0.4

Editoval mesour (25. 2. 2015 14:11)

FJP napsal(a):

Jinak pěkná APIna, tohle by mohlo být u všech addonů :)

JoJo je to super :-) No je to obyč http://apigen.org/ od českých autorů. Stačí spustit jeden příkaz na složku se zdrojáky a máš to celé hotové, práce na pár minut i s nahráním na server ;-)

@raketoplan2005 Ahoj, jediná věc co jsem zatím udělal bylo vypnutí filtru ( nezapínal sem možnost $grid->enableFilter(); ). Rychlost načítaných dat opravil @mesour pro DibiDataSource. Při porovnání rychlostí bylo dosažené mnohem lepších výsledků rychlosti načítání s Nette database, ale tuhle hypotézu zatím nemám ověřenou (během pár dní si chci vyzkoušet).

Je sice pravda, že v sandboxu všechny js a css jsou, ale jednak by to v dokumentaci mohlo být explicitně vypíchnuté, ale hlavně by to mělo být automaticky v instalaci přes composer, když si chci grid přiinstalovat do mého projektu.
Toto je obecně problém u všech doplňků, kdy jejich zprovoznění znamená příšerné laborování s js a css.

Ahoj,

čučím do toho jako vůl… vidíte někdo chybu? Filtrování vůbec nechce reagovat. Díky za pomoc.

	protected function createComponentUsersDataGrid($name) {
		$selection = $this->context->users->findAll();
		$source = new NetteDbDataSource($selection);

		$table_id = 'id';

		$grid = new Grid($this, $name);

		$grid->setLocale('cs');
		$grid->setPrimaryKey($table_id);
		$grid->setDataSource($source);

		$grid->enableFilter($this['userFilter']); // here set your form component

		$filter_values = $grid->getFilterValues(); // get values from filter

		// using custom filtering
		if (empty($filter_values) === FALSE) {
			if (isset($filter_values['name_surname']) && !empty($filter_values['name_surname'])) {
				$source->where('CONCAT(first_name, " ", last_name) LIKE ?', '%' . $filter_values['name_surname'] . '%');
			}
			if (isset($filter_values['email']) && !empty($filter_values['email'])) {
				$source->where('email LIKE ?', '%' . $filter_values['email'] . '%');
			}
			if (isset($filter_values['id']) && !empty($filter_values['id'])) {
				$source->where('id = ?', $filter_values['id']);
			}
		}

		(...)

	}

	protected function createComponentUserFilter() {
		$form = new Form;
		$form->addText('id', 'ID')->setAttribute('placeholder', 'ID');
		$form->addText('name_surname', 'Jméno, příjmení')->setAttribute('placeholder', 'Jméno, příjmení');
		$form->addText('email', 'E-mail')->setAttribute('placeholder', 'E-mail');
		$form->addSubmit('filter', 'Filtrovat');
		$form->addSubmit('reset', 'Reset');
		return $form;
	}

A u defaultního filtru se mi nerozbalují dropdowny a nereaguje ani tlačítko RESET.

Editoval FJP (27. 2. 2015 17:16)

Chtěl bych se zeptat, jestli se někomu daří nastavit české názvy dnů v týdnu u sloupce pro datum. Např. pro

<?php
$grid->addDate('datum', 'Datum')->setFormat('l j. n. Y');
?>

mi to vrací třeba Saturday 28. 2. 2015 ale místo Saturday potřebuji sobotu.

Zkouším něco takové setlocale (LC_ALL, „cs_CZ.UTF-8“); ale bez úspěchu.

Nesetkal se s tím někdo?

Díky

mpis napsal(a):

Je sice pravda, že v sandboxu všechny js a css jsou, ale jednak by to v dokumentaci mohlo být explicitně vypíchnuté, ale hlavně by to mělo být automaticky v instalaci přes composer, když si chci grid přiinstalovat do mého projektu.
Toto je obecně problém u všech doplňků, kdy jejich zprovoznění znamená příšerné laborování s js a css.

raketoplan2005 napsal(a):

Ještě by mě pak zajímal v dokumentaci nějaký přehled jaké JS/CSS soubory je nutné připojit pro určitou rozšiřující funkcionalitu. Např. Stránkování a řazení mi v defaultu nefunguje, u řazení a filtrů chybí ikonky. Zkrátka – pokud chcete filtry v defaultní podobě – měli byste mít tohle atd.

Required jsou popsané na hlavní stránce: http://grid.mesour.com/

FJP napsal(a):

Ahoj,

čučím do toho jako vůl… vidíte někdo chybu? Filtrování vůbec nechce reagovat. Díky za pomoc.

…

A u defaultního filtru se mi nerozbalují dropdowny a nereaguje ani tlačítko RESET.

Byla tam chyba v JS, takže nastával JS error a od té doby nic následujícího nemohlo fungovat. To bylo u custom filtru.

V defaultním filtru byly také nějaké chyby. Všechno už jsem opravil a opravy budou v 2.0.5, která už je nyní ke stáhnutí.