I have a view model that is being used to populate a grid using razer. One of the columns is a bool datatype, and I would like the grid to display the current state of each bool in checkbox form. And I would like to be able to edit the checkbox for each row by clicking on the checkbox once.
Is this something that is possible? Currently with the use of infragistics.core.js, the value is displayed correctly with a checkbox but the disabled property is set to true and I have had no luck changing that.
Hello Jarrett,
Template can access the values of the columns and visualize them in the way user desires.
For example if you have columns in the Grid with key "weather" you can get the value of the column using ${weather} in the template.
For example
x.Columns.Add(new GridColumn() { Key = "Weather", DataType = "string", Width = "200px", Template = "<div style='color: red;'>${Weather}</div>"
You can also pass different value inside the template as it is string representation of the elements inside the column's cells.
Thank you for the response, this "Template" is actually more what I was looking for.
Can this template reflect the values from a passed in view model?
Hello Sonali,
If I understood correctly the question is if it is possible to have multiple checkboxes in each cell of the column.
Column template allows you to have custom elements inside each cell of a column. For example if you want to have two checkboxes on each cell inside a column you can like:
@(Html.Infragistics() .Grid(Model) .Columns(x => { x.Columns.Add(new GridColumn() { Key = "CheckboxesColumn", DataType = "string", Width = "250px", Template = "<input type='checkbox'/><input type='checkbox'/>" }); }) ...
You can see more about templates here.
I have a question here:
Is it possible to have multiple checkbox values on one column in igGrid of ignite ui/infragistics using razor MVC ?
To render the boolean column via checkbox set renderCheckbox option to true.
@(Html.Infragistics() .Grid(Model) .RenderCheckboxes(true) …
In order to directly update the value of the cell you can handle the editCellStarting.
Afterwards you can update the cell value using setCellValue method.
Afterwards you can cancel cell updating.
Here is a sample if the Boolean column's key is 'Fixed'.
$(document).delegate("#Grid1", "iggridupdatingeditcellstarting", function (evt, ui) { if (ui.columnKey !== "Fixed") { return true; } var state = ui.value; $("#Grid1").igGridUpdating("setCellValue", ui.rowID, "Fixed", !state); return false; });
You can find the sample for more details here.