Print Page - Re-apply formatter in one cell

Title: Re-apply formatter in one cell
Post by: jherrera on June 10, 2013, 06:33:10 AM

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

Title: Re: Re-apply formatter in one cell
Post by: stworthy on June 10, 2013, 09:29:46 AM

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;
	}
}

Title: Re: Re-apply formatter in one cell
Post by: jherrera on June 10, 2013, 09:37:10 AM

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?

Title: Re: Re-apply formatter in one cell
Post by: stworthy on June 10, 2013, 10:22:04 AM

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>');
		}
	});
});

Title: Re: Re-apply formatter in one cell
Post by: jherrera on June 11, 2013, 02:35:10 AM

Thank you, I'll try with this option.

EasyUI Forum

General Category => EasyUI for jQuery => Topic started by: jherrera on June 10, 2013, 06:33:10 AM