Kendo Grid Jednoduchý grid stĺpca Menu pre zobrazenie / skrytie stĺpcov mriežky - jquery, kendo-ui, kendo-mriežka, kendo-ui-mvc, kendo-ui-grid

Namiesto zobrazenia ponuky stĺpcov na každom stĺpci v mojom rošte chcem jedno menu na vrchole mriežky, s ktorou môžem ovládať zobrazovanie / skrytie stĺpcov a zmrazenie / rozmrazovanie stĺpcov.

Pozrite si referenčný obrázok, ktorý vám prináša nápad.

odpovede:

Kľúčové rozhranie rozhrania Kendo má miniaplikáciu kendoColumnMenu. Ak predpokladáme, že "mriežka" je prvok mriežky, máme: HTML (fa -... sú štýly písma úžasné):

<a class="btn btn-icon grid-column-menu fa fa-columns" href="#" title="Manage columns."></a>

JS:

var $gridColumnMenuButton = $(".grid-column-menu").kendoColumnMenu({
filterable: false,
sortable: false,
dataSource: grid.data("kendoGrid").dataSource,
columns: true,
owner: grid.data("kendoGrid"),
});

$gridColumnMenuButton.on("click", function(e) {
$(this).find(".k-header-column-menu").click();

return false;
});

CSS:

.grid-column-menu .k-header-column-menu {
height: 35px;
visibility: hidden;
position: absolute;
left: 0; }

To vám umožní skryť / odkryť stĺpce.