Re-apply formatter in one cell

[jherrera]

Hello,
Could we re-apply a cell formatter in a particular case when some conditions happen in other cells?

For example, using your edatagrid inline editing example, if user selects someting in a selectbox in the first field of that row, we would like to apply formatter to the last cell (p.e. putting text in red).

Thanks in advance

[stworthy]

Yes, you can return special value regarding particular conditions in 'formatter' function. Please try the code below.

Code:

formatter:function(value,row){
	if(row.fields==something){
		return '<span style="color:red">'+value+'</span>';
	} else {
		return value;
	}
}

[jherrera]

Thank you for your response,

Yes, this is great to include the formatter at the declaration of the table grid.

But we meant if we can change the cell by calling the formatter "in real time" not just in the declaration of the datagrid, is this possible?

For example, if we are in editing mode, we need to change one specific cell only when other cell has changed by selecting an item in its combobox.
How do we call the formatter in that case?

[stworthy]

In editing mode you can't change one cell's value directly but you can extend an editor to simulate this action.

Code:

$.extend($.fn.datagrid.defaults.editors,{
	label:{
		init:function(container,options){
			return $('<div></div>').appendTo(container);
		},
		getValue:function(target){
			return target.value || $(target).html();
		},
		setValue:function(target,value){
			target.value = value;
			$(target).html(value);
		},
		resize:function(target,width){
			$(target)._outerWidth(width);
		}
	}
});
$(function(){
	$('#tt').edatagrid({
		columns:[[
			{field:'attr1',editor:'label',...}
		]],
		onEdit:function(index,row){
			var ed = $(this).edatagrid('getEditor',{index:index,field:'attr1'});
			// change the 'attr1' cell of the editing row
			$(ed.target).html('<span style="color:red">'+row.attr1+'</span>');
		}
	});
});

[jherrera]

Thank you, I'll try with this option.