[Solved] Using Formatter in JSON object with Datagrids

[Darrel]

Hello,

I was trying to use the formatter property to create a hyperlink for the first column of the datagrid. I tried referring to the following links:

http://www.jeasyui.com/forum/index.php?topic=4585.0
http://www.jeasyui.com/forum/index.php?topic=5268.0
http://www.jeasyui.com/forum/index.php?topic=3486.0


But they didn't help me out much. I only need the formatter to work for the first column only, i.e, i want the hyperlink to be visible in the first column only. Below are the changes that i've carried out to achieve the same, but failed due to a script error.

This is my JSON object that is created after the ajax call:

Code:

{"COL_LIST":{"COL_DATA":[{"field":"col_0","title":"Client Code","formatter":"createLink"},{"field":"col_1","title":"Client"},{"field":"col_2","title":"Account"},{"field":"col_3","title":"Type Code"},{"field":"col_4","title":"Client Id"},{"field":"col_5","title":"Type"}]},"ROW_LIST":{"ROW_DATA":[{"col_0":"ROW0A03","col_1":"ABC DEBIT FUND","col_2":"A03","col_3":"ABCD","col_4":"6565","col_5":"AUTHORIZED"},{"col_0":"ROW1A03","col_1":"ABC DEBIT FUND","col_2":"A03","col_3":"EFGH","col_4":"17869","col_5":"AUTHORIZED"}]}}

The following code is written in my html page:

Code:

<TABLE id="RESULTS_TABLE"></TABLE>

The following code is written in the javascript block:

Code:

function createLink(value,row,extra)
{
	//var href = 'get_details.php?userid='+row.id;
	var href = "#";
	return '<a target="_blank" href="' + href + '">' + value + '</a>';
}

//json string mentioned above is passed here as a parameter to createDataGrid function.
function createDataGrid(data)
{
	data = JSON.parse(data);

	var col_data;
	var row_data;

	for (var key in data) {
		var val = data[key];

		for(var child_key in val)
		{
			//alert("key: " + child_key + "\nvalue: " + val[child_key]);
			if(child_key == "ROW_DATA")
			{
				row_data = val[child_key];
				//alert("row_data: " + row_data);
			}
			if(child_key == "COL_DATA")
			{
				col_data = [val[child_key]];
				//alert("col_data: " + col_data);
			}
		}
	}

	$('#RESULTS_TABLE').datagrid({
		columns: col_data,
		data: row_data,
		height:'auto'
	});
}

I get a script error stating "function expected". Is it something that I'm doing wrongly in the JSON string?

Thanks in advance!

Regards,
Darrel

[stworthy]

The 'formatter' should be a function not a string, please convert it to a function before creating the datagrid.

Code:

function createDataGrid(data)
{
    data = JSON.parse(data);
    var columns = data.COL_LIST.COL_DATA;
    columns[0].formatter = eval(columns[0].formatter);
    ...
}

[Darrel]

Thanks a lot stworthy,

It worked using the sample lines you gave.



Regards,
Darrel.