ublaboo/datagrid: mocný, rychlý, rozšiřitelný, hezký, anglicky dokumentovaný datagrid

@n3t Díky, tohle mě konečně nakoplo správným směrem. Takže v čem byl problém:

1. Kvůli tomu, že pořád používám Nette 2.4, mi composer stáhl Datagrid ve verzi 5.7.4.
2. O tom Bower samozřejmě nevěděl, a tak příkazem bower install ublaboo-datagrid stáhl nejnovější JS+CSS (pro verzi 6.2.5).

Oprava / úprava instalace pro verzi 5.* tedy spočívá ve stáhnutí staršího bower balíčku:

bower uninstall --save ublaboo-datagrid
bower install --save ublaboo-datagrid@5 happy@1 bootstrap-select font-awesome@4

a úpravě cest k JS+CSS souborům tak, aby pasovaly. Taky doporučuju downgradovat happy.js (v nové verzi chybí adresář dist), doinstalovat bootstrap-select a natáhnout font-awesome (verzi 4, protože s 5 a výše není tato verze DataGridu v základu kompatibilní).

Oprava suma sumárum v jednom commitu:
https://gitlab.com/…830a984f9049?w=1

Editoval nanuqcz (11. 12. 2019 17:03)

@Failips Datagrid používám krátce, ale není ta metoda $this['myGrid']->reload()? Co pak ten AJAX požadavek vrací prohlížeči za data, když se podíváš do konzole prohlížeče?

Ahoj,
nevíte jak udělat, aby se group action otevřelo v novém okně. Mám tam pdfResponse a potřebovali by to do nového okna. Díky

Zdravím mám problém s Datagrid items
nemůžu zobrazit jakýkoliv ItemDetails, přitom AJAX request proběhne a např. při sortování funguje…
Verze datagridu: 6.2.5
Verze Nette 3.0
Takový nepodstatný detail, co by nic neměl ovlivnit, data si táhám z API a ne z DB
Druhy nepodstatny detail, v zoufalosti jsem si docesne pustil online knihovny z DEMA

Presenter:

public function createComponentDatagrid()
  {
    $grid = new DataGrid;

    $grid->setDataSource($this->userManager->getUsers());
    //columns
    $grid->addColumnNumber('id', 'ID');
    $grid->addColumnText('name', 'Jmeno')->setSortable();
    $grid->addColumnText('superuser', 'Admin');
    $grid->addColumnText('email', 'E-mail');
    $grid->addColumnDateTime('lastLoginDate', 'Naposled přihlašen');
    $grid->addColumnStatus('state', 'Status');
    //filters
    $grid->addFilterSelect('state', 'Status', State::ALL);
    $grid->addFilterText('name', 'Jmeno');
    $grid->setItemsDetail();

    $grid->setTemplateFile(__DIR__ . '/../templates/datagrid/item-detail-grid.latte');

    return $grid;
  }

template pro detail, ostatní věci mi měnit přes {block} jdou, ale detail se jako jedinej nezobrazuje

{extends $originalTemplate}
{block detail}
	<button class="btn btn-default btn-secondary btn-sm">Just a button</button>
{/}

template Presentru

{block content}
<div class="container">
  <h1 n:block="title" class="text-center">Titulek nefunkcni stranky</h1>
    {control datagrid}
</div>

galab napsal(a):

Aleksandr napsal(a):

Zdravím mám problém s Datagrid items
nemůžu zobrazit jakýkoliv ItemDetails, přitom AJAX request proběhne a např. při sortování funguje…

bower update jsi dělal?

Jo zkoušel jsem to tahat i přes bower a nikdy se nic nezmění…ChromeDev konzole je stále bez chyb

galab napsal(a):

A?

$grid->setItemsDetail(__DIR__ . '/../templates/datagrid/item-detail-grid.latte');

Tohle jsem taky zkoušel…

@Aleksandr No jo, taky se mi to děje. Hodím na to oko

Ahoj Pavle (@PavelJanda),

mám ještě jeden dotaz. Jak získám id aktulní row, prosím, potřebuji to do actiony.

public function create(): DataGrid
{
    $grid = $this->dataGrid->create();

    //columns
    $grid->addColumnNumber('id', 'ID')
        ->setSortable();
    $grid->addColumnText('name', 'Jméno')
        ->setSortable()
        ->setFilterText();
    $grid->addColumnText('superuser', 'Admin')
        ->setSortable();
    $grid->addColumnText('email', 'E-mail')
        ->setSortable()
        ->setFilterText();
    $grid->addColumnDateTime('lastLoginDate', 'Naposled přihlášen')
        ->setSortable();
    $grid->addColumnText('state', 'Status')
        ->setSortable()
        ->setReplacement(State::ALL)
        ->setFilterSelect(State::ALL);
    $multiAction = $grid->addMultiAction('subjects', 'Subjekty');

    foreach ($userSubjects as $subject) {
        $multiAction->addAction($this->getUserSubject($semChciIDaktualniROW), $subject, 'this', ['id']);
    }

    //sets details for user
    $grid->setDataSource($this->userManager->getUsers());

    return $grid;
}

Ahoj,

chci se zeptat, je tu možnost ručně určit, kdy se má datagrid inicializovat? Konkrétně tedy datagrid.js, kdy potřebuji aby se načetl až po tom, co se načte Naja v údálosti DOMContentLoaded

Díky :)

Editoval janvacek (15. 1. 2020 8:19)

Předpokládám, že se to snaží zaregistrovat listener dřív, než je Naja inicializovaná?

Předně je tam podle mě chyba. Listenery můžeš registrovat teoreticky kdykoliv, s výjimkou init, kterážto událost se vyvolává jen v momentě, kdy se Naja inicializuje. Beru zpět. Pravda to sice je, ale v datagrid.js se listenery navěšují v extensioně, ta musí být zaregistrovaná před inicializací.

Editoval jiri.pudil (15. 1. 2020 13:16)

@PavelJanda @jiripudil Díky za odpověď, povýšení verze pomohlo. Nepochopil jsem, proč se mi composerem nainstalovala ta stará verze datagridu, ikdyž jsem měl v composer.json verzi ^6.2

@TonnyVlcek Myslím, že by to nemusel být problém. Dělal jsem i docela velké gridy, šlo to easy.
Spíš bych se zamyslel nad tím, abyste neměli v rámci kódu „nepořádek“. Třeba bych factory gridu rozdělil mezí víc factories (na akce, na sloupce, atd).
Nicméně výkonnostně by to asi neměl být problém. Navíc inline edit callback se volá pouze pro jednu položku jednoho sloupce, easy..

Spíš zkus obchoďákům říct, ať pošlou pořádnou donation, ať se zas vývoj datagridu pohne. :D Můžeš to obhájit třeba tak, že se opraví nějakej superzávažnej bug, kterej vám hrozně brání v práci. :D

Každopádně, až to budete mít hotovo, poděl se o výsledky benchmarku! Rád se na ně mrknu, pokud to nebude tajné.

Editoval Pavel Janda (17. 1. 2020 10:50)

Ahoj, chceli by sme urobiť ukladanie stavu jednej tabuľky (grid state) per užívateľ. Ide o to, že po prihlásení by užívateľ mal tabuľku v takom rozložení ako ju naposledy zanechal. Pôvodný nápad bol vytiahnuť z gridu jeho stav napr. vo forme JSONu a uložiť to do databáze, následne pri prihlásení a otvorení stránky s touto tabuľkou by sme načítali tieto hodnoty z DB.

Vie niekto o spôsobe, ktorým pri každej zmene rozloženia (filtre, zobrazené stĺpce, max. počet riadkov) dalo získať tieto hodnoty nejakým jednoduchým spôsobom? Vďaka :)

Ahoj,
prosím pomoc, jsem zoufalý! :-)

Měl jsem funkční administraci pro můj projekt. Používám poslední dostupné Nette 3.0 (staženo přes composer cca 3 týdny zpět). Nainstaloval jsem si tam přes composer ještě pár plug-inů (kdyby/translation a tomaj/nette-bootstrap-form). Vše mi fungovalo v pořádku.

Dnes jsem přes příkaz composer require ublaboo/datagrid stáhl tenhle DataGrid a po aktualizaci prohlížeče (aniž bych cokoli kdekoli měnil ve zdrojových souborech) mám následující chybovou hlášku:

Fatal error: Uncaught Error: Class 'App\Bootstrap' not found in C:\xampp\htdocs\admin.deskovia.cz\www\index.php:7 Stack trace: #0 {main} thrown in C:\xampp\htdocs\admin.deskovia.cz\www\index.php on line 7

Což mě teda tak trochu navádí k tomu, že App\Bootstrap nebylo nalezeno, ale Bootstrap.php soubor je v namespace App

<?php
declare(strict_types=1);
namespace App;
use Nette\Configurator;
class Bootstrap {
...
?>

Tak já nevím co mám zle :( Můžete mi prosím někdo hodit pomocné lano, jak zprovoznit DataGrid / nebo odinstalovat, abych měl zas zpět funkční administraci? :)

PS: composer uninstall --save ublaboo/datagrid nefunguje a vyhodí hlášku [Symfony\Component\Console\Exception\CommandNotFoundException] Command "uninstall" is not defined.

Gappa napsal(a):

@chemikus

Bootstrap se autoloaduje pomocí composeru:

• https://github.com/…omposer.json#L28

Zkusit tedy dát něco jako composer dump-autoload? :)

Dobře, napsal jsem do příkazového řádku …

c:\xampp\htdocs\admin.deskovia.cz>composer dump-autoload

napsalo to …

Generating autoload files

A chyba stále stejná :(

Fatal error: Uncaught Error: Class 'App\Bootstrap' not found in C:\xampp\htdocs\admin.deskovia.cz\www\index.php

Co dělám špatně teď? :)

Gappa napsal(a):

@chemikus

Pro kontrolu – ta odkazovaná část v composer.json v něm je? :)

• https://github.com/…omposer.json#L28

Velmi dobrá poznámka :) Když se podívám do composer.json hned v kořenovém adresáři, tak je tam napsáno pouze:

{
    "require": {
        "ublaboo/datagrid": "^6.2"
    }
}

Takže nyní asi soutěžní otázka zní, proč? A jak tam dostat ten zbytek? :)

Tam je jen a pouze tohle? Nic z nette? Jak se ti ho pak ale podařilo nainstalovat? :)

Ano ano, jen a pouze toto. Asi při instalaci dataGrid nějaká chybka. No, nicméně už vím, kde je problém, moc děkuju za pomoc!

Btw, možná lepší založit nové vlákno někde na foru, téma se poněkud stočilo od datagridu někam úplně jinam.

Možná navrhuji smazat všechny moje/tvoje komentáře, ať tím zbytečně nebereme místo?

Ahoj,
prosím o radu,
existuje nějaká možnost, jak tento kód doplnit o třetí parametr funkce groupParamUpdate?

$grid->addGroupTextAction("Nazev")->onSelect[] = [$this, 'groupParamUpdate'];

abych se dostal k zavolání např.

groupParamUpdate($ids, $value, $treti_parametr)

Předem díky moc za rady!

Lze v rámci inlineEdit nebo inlineAdd zobrazit chybu formuláře? Např. při definování Form::addRule a odeslání s chybnou hodnotou?

Datagrid v5.7.4

@Aleksandr Vše by mělo být popsáno zde:

Renderer: https://contributte.org/…columns.html#…
Custom filter: https://contributte.org/…filters.html#…

Tímhle vyrenderuješ úplně custom data a aplikuješ úplně custom podmínku pro filtraci nad tím sloupcem.

@kamil_v Tohle by vyřešil nějaký JS kalendář, ne? :)

Ahoj,

chci se zeptat jak dát tlačítko Reset filtrů nahoru, myslim jak to vyřešit nejčistejc (css, toolbar tlačítko nebo…)?
 – chci, aby se zobrazovalo jenom nahoře a jenom za podmínky, kdy je filter vyplněn

Editoval Aleksandr (11. 2. 2020 11:39)

Nevím, jestli to tu už někdo řešil, ale zatím hledám marně a stejné problémy jsou i v demu:

• Když kliknu na další stránku, změní se stránka a adresa. Ale když pak použiju jen tlačítko zpět, změní se adresa, ale stránka se nepřekreslí.
• Když jednou změním počet řádků a pak ho vrátím na defaultní, tak stejně zůstává v adrese &grid-perPage=20. Stejně tak když adesu ručně promažu od parametrů, tak nenaskočí defaultní hodnoty, ale znovu se tam objeví.

A mimochodem, stránku http://ublaboo.paveljanda.com/datagrid/ mi Chrome odmítá otevřít kvůli neplatnému certifikátu. Nejspíš se vynutí https a ten pak neprojde přes certifikát. Použití http v adrese neprojde.

Editoval Šaman (17. 2. 2020 14:13)

Jj, tuhle dokumentaci používám, ale ty dva problémy výše se mi nepodařilo vyřešit a jsou i v demu.
A propo, Datagrid používá nette.ajax.js, který je myslím už neudržovaný(?). Nebo bude fungovat i jinými knihovnami pro zajaxování Nette?

TL;DR:
Po úspěšném zpracování inline editace potřebuji aby datagrid „přeskočil“ a otevřel editaci pro jiný (třeba následující) řádek.

Rád bych to provedl v jednom requestu a na serveru (tj. bez nutnosti mít js který třeba provede kliknutí na tlačítko editace).
Procházel jsem callstack a jako nejlepší kandidát se mi zdál callback onCustomRedraw – provádí se úplně na konci zpracování inlineEditu, a tak jsem doufal, že tam budu schopný zavolat handle dalšího inlineEditu:

$grid->getInlineEdit()->onCustomRedraw[] = function () {
			$this->grid->redrawItem(18);
			$this->grid->handleInlineEdit(19);
		};

(jen příklad, reálné id řádků bych si odněkud snad vytáhnul)

Výsledek:
https://gifyu.com/image/74L8
Změny se uloží, další řádek je editovatelný, ale původní řádek zůstane také editovatelný.

Je tohleto správná cesta, a pokud jo, jak donutit původní řádek aby se zavřel? Nebo, napadá někoho lepší způsob jak na to?