Grid Choose columns demo

This demo shows how columns can be set/modified at the server side,
feature that is also used in the scheduler demo and array datasource demo.

Drag a column header and drop it here to group by that column
Id
Person
Food
Location
Date
Price
679RajeshOat mealDiner1/11/201823
683BenFrench toastTavern2/19/201820
687JustinHot BeverageCentral Perk3/1/201345
691CourtneyCheesecakeUniversity9/13/201979
695BernadettePizzaTavern2/1/201220
699TimmyShepherd's pieVisit6/9/201479
703ClaudiaHot BeverageUniversity10/1/200921
707MateoAppleVisit5/13/201345
711GabrielleFrench toastDiner2/11/201321
715JamieCheesecakeTavern10/25/2017100

using api 

using checkboxlist 

note: using persistence Session, try removing some columns, group by a column, and refresh, to mantain the same columns even after reopening browser change to Persistence.Local

Showing how the grid columns can be set/modified in the controller.
The grid has .SendColumns(true) which will send the columns state information on each request, on the first request g.Columns.Length is 0, this is where we set the default column definition. Columns are picked by sending additional parameters using oparams (one time parameters), and by modifying/setting the g.Columns (when g.Columns has Columns in it, the grid will use it instead of what it's specified in the markup). The gridModel.tg is populated with data to be used by the AjaxCheckboxList, on grid aweload event the api of the AjaxCheckboxList is called. Persistence will save the state of the grid ( page, collapsed groups, columns )



Comments