ublaboo/datagrid – big edit se selectem
- cafesk8
- Člen | 103
Zdravím,
vytvořil jsem si pěkně funkční datagrid s big-inline editací.
Potřeboval bych po kliknutí na „edit“ v jednom sloupečku data vybírat
ze selectboxu namísto je psát ručně jako text. Něco jako možnosti pro
sloupec, kde vyberu jednu z definovaných „options“ a poté uložím.
Koukám že u small-inline editace něco takového je, ale já bych to potřeboval při editaci celého řádku.
.....
$grid = new DataGrid($this, $name);
$grid->setDataSource($this->myRepository->findAll());
$grid->addColumnText('input_price', 'Vstup')
->setSortable()
->setFilterText('input_price');
$grid->addColumnText('output_price', 'Výstup')
->setSortable()
->setFilterText('output_price');
$grid->addColumnText('type', 'Typ')
->setSortable()
->setFilterText('type');
.....
$grid->addInlineEdit()
->onControlAdd[] = function($container) {
$container->addText('input_price', '');
$container->addText('output_price', '');
$container->addText('type', ''); /// zde bych potřeboval něco jako addSelect(array(1 => 'one', 2 => 'two' ));
};
Nemáte s tím někdo zkušenosti nebo nenavedete mě správným směrem?
Editoval cafesk8 (27. 11. 2018 15:59)
- Honza.Mottl
- Člen | 104
pokud se nedaji udelat selecty ze serverove strany, tak bych se to snazil obejit v JavaScriptu:
- nastavil bych si do inputu data atribut data-my-select abych takovy input poznal
- do data atrtibutu data-select-options bych nastavil options
- pri doruceni snippetu bych dal input na hidden a podle neho bych vytvoril select
- stejne pri kliknuti na Add bych to udelal podobne jako ve 3)
- na udalost change bych vzdy odzrcadlil hodnotu ze selectu do hidden inputu
Rekl bych, ze by to tak mohlo jit. Datagrid u inputu prestavi class. Pokud ho potrebujes nastavit, tak je treba k tomu pouzit data atribut a prestavit si to v Javascriptu.
//
// It's necessary to set data-my-select attribute in your PHP addInlineEdit() and addInlineAdd() functions
//
function createMySelect(el) {
var options = $(el).attr('data-select-options');
var selectEl; // vytvorit select s pouzitim options
// selectEl = ...
$(el).after(selectEl);
$(el).setClass('hidden');
}
// call this code during page initialization
// all inputs having data-my-select are processed
//
$('a[data-datagrid-toggle-inline-add="true"]').click(function () {
// inputs used for new records
$('tr.datagrid-row-inline-add td.datagrid-inline-edit input[data-my-select]').each(function () {
// you can set class or data attributes here
createMySelect(this);
});
});
$('muj select').change(function () {
// odzrcadlit zmeny do inputu
});
$.nette.ext('datagrid.handling', {
success: function(payload) {
if (payload._datagrid_inline_editing) {
$('td.datagrid-inline-edit input[data-my-select]').each(function () {
createMySelect(this);
});
}
}});