Kendo-ui grid with differents field type in the same column

Question

I´d be very grateful if someone could help me out with this issue.

I´ve a kendo grid in my web app. This kendo grid is poblated with a set of questions and answer. I mean has two columns, the first one is the question and the second column is for the answer.

The question column is type text but the answer column may be of three types (boolean, selectablelist or text).

Throught creating a custom editor I achieved to have the right field type when you press in the cell.

I attach a image to explain: snapshot1 The problem is that when the cell lost the focus the custom editor template is not visible anymore so the grid looks like: snapshot2

I´d like to keep the checkbox template when I´m editing the cell and also when I´m not editing it.

I´ve tried to create a custom template for the editor and a custom template for the cell (while I´m not editing it) but this solution creates two different DOM object, so when I click in the cell I´m clicking in the template, not in the grid, so the grid doesn´t recognize when i´m doing changes.

Thanks in advance!

Answer 1

A way to solve your checkbox issue is to use a custom template. Take a look at the following DOJO

Note the function createCheckbox() . It uses model binding to show the correct value and disables the checkbox so a user can only change its value in the edit mode.

function createCheckbox(fieldName) {
    return '<input style="cursor:default;" type="checkbox" data-bind="checked: #=' 
      + fieldName + '#"  #= ' + fieldName 
      + ' ? \'checked="checked"\' : "" # disabled="disabled" />';
}