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

@jAkErCZ Je tam asi 10 různých spinnerů (item detail – očíčko se začne točit, stránkování má spinner dole, group action má spinner nahoře atp), ale vyhledávání je dost custom action. Zkus kouknout na nette.ajax.js spinner extension, které jsou v repu, inspirovat se a přidat svojí extension. Do 10 minut bys měl rozchodit vše, co potřebuješ.

jAkErCZ napsal(a):

@PavelJanda No jako našel jsem nějaké věci a to mi zase nejede vůbec vyhledávání… Já a js není moc dobrý :D

Ja to mam definovane takto:

(function($, undefined) {

$.nette.ext('spinner', {
	init: function () {
		this.spinner = this.createSpinner();
		this.spinner.appendTo('.navbar-header');
	},
	start: function () {
		this.counter++;
		if (this.counter === 1) {
			this.spinner.show(this.speed);
		}
	},
	complete: function () {
		this.counter--;
		if (this.counter <= 0) {
			this.spinner.hide(this.speed);
			$(".alert").fadeTo(10000, 500).slideUp(500, function(){
				$(".alert").slideUp(500);
			});
		}
	}
}, {
	createSpinner: function () {
		return $('<div>', {
			id: 'ajax-spinner',
			css: {
				display: 'none'
			}
		});
	},
	spinner: null,
	speed: undefined,
	counter: 0
});

})(jQuery);

Asi tam nemas ten element s classou navbar-header. Zmen si to na neco, co v layoutu mas…

@jAkErCZ ale hide a show jsou funkce jQuery. Dle chyby co ti to pise mi to pripada, ze se ti nevytvori ten spinner element, proto ti hlasi, ze spinner je null

@jAkErCZ Ještě jednou tě poprosím, pokud máš problém s html, css, js, php, jQuery nebo něčím podobným, zkus kontaktovat některého z lektorů a mrknout na danou problematiku s ním. Tohle vlákno je hlavně o komponentě ublaboo/datagrid. Tvoje otázky jsou často mimo a nesouvisí s tématem.

Neber to nijak špatně, chápu, že potřebuješ pomoci. Jen podotýkám, že je dost lidí, kteří studují zpětně zprávy tohoto vlákna. Jenže poslední dvě stránky nenesou žádnou důležitou informaci.

Díky ti.

New release: https://github.com/…s/tag/v5.3.0

@pitr82 Datagrid používá bootstrap-datepicker, jeho lokalizace by neměla dělat problém: https://bootstrap-datepicker.readthedocs.io/…st/i18n.html

Přemýšlím, zda to nějak nezkombinovat se slovníkem v datagridu. Hm.

@PavelJanda češtinu jsem načetl hned pod plugin, ale nepočeštilo mi to…
Máš někde sandbox s češtinou ?

@PavelJanda Mam dotaz – mam grid, ve kterem mam inline editaci odkazu. Odkaz nicmene vykresluji jako htmlko (ikonka s odkazem). Jsem nejak schopny u male inline editace udelat nejaky filtr co se ma vepsat do toho pole? Aby tam byl ten link, ne HTML toho odkazu a ikonky?

Viz https://gfycat.com/…fectKangaroo

@raddy668 Jasně, už aespoň 5 minut je to hotové ve verzi 5.4.0 (k vyzkoušení v demu ve sloupci s tím linkem) :D
Dík za nápad

(je třeba aktualizace assetů..)

Editoval Pavel Janda (13. 6. 2017 10:20)

@raddy668 Asi bych (jedno nebo druhé):

1, si udělal scriptík, který čapne data z tvého custom inputu, klikne na ten button přidání záznamu a zkopčí do toho inline přidání jméno toho usera z tvého inputu
2, si udělal scriptík, který mi bude našeptávat jména rovnou do inlie přidávání :P
(Inline přidávání se nechá lehce vykreslit nahoře)

Editoval Pavel Janda (13. 6. 2017 10:48)

@raddy668 :D Prozkoumám večer

Potrebuji nejak udelat filter pro 1:n zaznamu. Rekneme ze mam produkty, ke kazdemu produktu existuji varianty. Varianta rika, ze je to ve velikosti ‚small‘ a ‚cervene‘ plus dalsi kombinace. Do gridu pridam filter, kde muzu vybrat velikost a druhy kde muzu vybrat. Vypsat pak potrebuji ty produkty u kterych existuje tato varianta. Tedy nejjednoduseji jako ‚id IN (select product_id … WHERE size = „small“ and color = „red“)‘.

Jako db layer pouzivam dibi. Bohuzel subquery to prelozi pri prvnim zavolani setCondition a druhy uz neupravi tuto subquery. Druha moznost byla pouzit onAfterFilter v DataModel, bohuzel je privatni.

Je nejaka moznost filtrovat podle toho jestli existuje nejaky zaznam, nebo je nejaka moznost pridat neco do data source po uplatneni vsech filteru?

@PavelJanda Jeste dotaz – na „velkou“ inline editaci se da udelat podminka, slo by nejak udelat aby ta podminka platila i pro „malou“ inline editaci? Nebo jde to nejak udelat? V manualu jsem to nedohledal.

Napr. mam vyfakturovanou polozku a nechcu aby sla nijak upravovat.

Diky

ahoj,
asi to bude jednoduchý, ale nijak rychle na to nemůžu přijít, jak mám přiřadit barvu textu dle nějaký podmínky…např. do sloupce ->setColumnNumber když value>=0 barva textu zelená else barva textu červená..
díky za nakopnutí ;)

Ahoj, jak můžu přidat date picker při inline editaci do formuláře prosím? Přes firebug stačilo přidat k k inputu

data-provide="datepicker" data-date-orientation="bottom" data-date-format="d. m. yyyy" data-date-today-highlight="true" data-date-autoclose="true" data-autosubmit="" data-autosubmit-change=""

Ale do datagridu nevim, jak toto přidat.

Ahoj,
nějak se mi nepodařilo přijít na spojení big inline editace a možnosti takto editovat jen některý řádky viz. allowRowsAction ..prostě aby se mi tlačítko na big inline editaci zobrazilo jen na některých řádcích dle mé podmínky…
a taktéž se mi nepodařilo (přes pořadí zápisu), aby tlačítko této akce bylo před jiným tlačítkem normální akce..je toto taky možné???

děkuji za odpovědi :)

@sevca79 To je v šabloně napevno. Nejrychlejší bude asi podědění šablony a upravení bloku tbody.

@PavelJanda
Zdravím chci se zeptat využívám vyhledávání dle ID a to se pak přenáší do dalšího gridu a v něm se dle toho ID které získalo vypíši informace co potřebuji a to v reálném čase a to stejné že když přidám nový řádek tak sem si zřídil že mi to reloadne a zůstane stále načtený ten grid s tím ID

$p['webPagesIDGrid']->setDataSource($p->companyManager->getComponiesWebPages($values->CompanyID));
$p['webPagesIDGrid']->redrawControl();

Jenže teď jsem narazil na problém že když je na daném ID více položek tak se vytvoří stránkování což je v pořádku ale když kliknu na další stránku tak se mi grid načte defaultní hodnotu což je NULL ale já potřebuji aby si nechal stále to ID tak jak jsem psal výše u přidávání řádku… Tak se chci zeptat zda-li se to dá udělat nejak jednoduše jak třeba to přidávání kde sem si přidal 2 řádky a funguje to… nebo musím hlouběji do gridu?

Díky

Editoval jAkErCZ (28. 6. 2017 12:32)

@jannemec Hmm, zajímavý požadavek. Pokud to správně chápu, chceš v inlineAdd přidat záznam pouze s vyplněným jedním číslem a potom hned otevřít itemDetail? Zkus po přidání záznamů poslat v payloadu spolu s ostatními hodnotami třeba nějaký string itemAddedInline: <id> + udělat nette.ajax.js extension, ve které odchytíš tuto property a přes JS spustíš stejnou akci, jako by spustilo zmáčknutí tlačítka „očíčko“.

ahoj,
nevím zda je to chyba resp. polochybka jen někde u mě, nebo v gridu :)
Když šoupnu do gridu inlineAdd a do formuláříku dám validační podmínku setRequired, tak mi najednou přestane fungovat automatické filtrování..pokud tam setRequired nemám, tak filtry běhaj tak jak maj, hned po stisku kláves..avšak když tam mám setRequired, tak musím nejdřív ve filtru naprázdno zaentrovat a pak se filtry rozběhnou…aspoň se to tak tedy chová na mém příkladu..bo mi tam něco ještě chybí??
viz.něco jako

public function createComponentPlayersGrid() {
        $playersData = $this->playersModel->getPlayersForGrid();

        $grid=new \Ublaboo\DataGrid\DataGrid();

        $grid->setPrimaryKey('id');

        //set datasource
        $grid->setDataSource($playersData);

        //jednotlive sloupce
        $grid->addColumnText('surname', 'příjmení')
                ->setSortable()
                ->setFilterText();

        $grid->addInlineAdd()
                    ->onControlAdd[] = function($container) {
                        $container->addText(PlayersModel::COLUMN_SURNAME, '')
                            ->setRequired('chyba');
        };


        return $grid;

Editoval sevca79 (30. 6. 2017 11:37)

Jeste jsem nasel drobny bug – kdyz mas hromadne zaskrtavatko na akce tak tam mas pocet zaskrtnutych checkboxu, trebas 5/5 … problem je v tom ze se tam pocita i ten checkbox pro hromadne zaskrtavani, takze pokud mam 3 polozky tak mi tam pise X/4 misto X/3 …

staci zmenit v datagrid.js tyhle 2 radky

<script>
checked_inputs = document.querySelectorAll('.datagrid-' + grid + ' input[data-check-all-datagrid]:checked'); // radek 149
total = document.querySelectorAll('.datagrid-' + grid + ' input[data-check-all-datagrid]').length; // radek 155
</script>

Když používám groupAction, je nějak možné z toho vyrenderovat CSV pro stažení? Pro info, přehled objednávek kde chci vytvořit export pro poštu – podání online.

Udělal jsem

	$grid->addGroupAction('export')->onSelect[] = [$this, 'postExport'];

	public function postExport($ids) {
		$exported = $this->export->setOrderIds($ids)->generate();

		if(count($exported)) {
			$name = 'CP-podani-online-'.date('d.m.Y').'.csv';
			$csvResponse = new CSVResponse($exported, $name);
			$presenter->sendResponse($csvResponse);
		}
	}

Což mi sice v ajax response vrátí data, ale jak mohu dát CSV ke stažení podobně jako je na https://ublaboo.org/datagrid/export ?

Ahoj,
je nějak možné dostat do metody setConfirm hodnoty více sloupečků?

$grid->addAction('delete', '', 'delete!')
	->setConfirm(
		'Opravdu smazat uživatele %s %s?',  // Opravdu smazat uživatele Jan Novák?
		['name', 'surname']
	);

Každopádně díky za nejlepší datagrid :-)

Zdravím chtěl bych se zeptat z jakého důvodu mi při používání

$grid->addColumnStatus

Kde mám možnost rozbalit nabídku a vybrat parametr který potřebuji se mi nechce rozbalit?
Všechno dle dokumentace mám od js,css atd…

Čím to může být způsobeno? nebo jak tento problém řešit?