Readonly Cells in datatable

Hello

My requirement to set some cells in DataTable to be read only and some as editable. This I want to do on rendering of the grid as well as dynamically later after rendering in javascript.
Is there any property on data/cell level to set it readonly and change editor of the that particular cell only ?

Currently read only is assigned on column level to CSS attribute and I would like to set it on every cell/data level.

There is no built in property, but it quite easy to implement such behavior through events

http://webix.com/snippet/b5c2f783

Above code returns false from onBeforeEditStart when edit operation must be blocked. You may use any other convention to mark the readonly cells.

Thanks that’s helpful…

One more question :
How to check if any value exist on cell on onBeforeEditStart event ? As I was trying to check with grid.getItem() but it doesn’t give cell value but returns whole row . And getEditor() method also doesn’t return editor (may be because on this event editor is not opened yet ?)

Is there any way to get cell value on this event?

Yep, getEditor will not work as editor is not opened yet.

As for cell value, you can get column name as

var column = id.column;
var value = this.getItem(id.row)[column];

sample is not working good for keyboard navigation. wrote a post concerning that issue…

http://forum.webix.com/discussion/4496/bug-datatable-tab-order-with-onbeforeeditstart

Hi, I’m trying to achieve the same functionality on a check box cell, but it is not working. Could you pls guide?

http://webix.com/snippet/5dc34525

Thanks in advance!

In case of checkbox you can use a bit different approach

http://webix.com/snippet/04033485

Here, custom template is used to disable checkboxes, that are marked as readonly.

Great Thanks!

i am trying to disable editing a cell in a property view but your example for a datatable is not working. i have the onclick event working when you click the correct cell but not sure what to do next. how do i disable edibility here?

var sow_details_left = {
	view:"property",  id:"sow_details_left",
	nameWidth:150,
        on:{
            'onItemClick': function(id){ 
	        if (id ==  "sow_filename") {
		        // need to disable editable cell here
	        }
                 }
            }
      }