easyui中datagrid如何使用formatter显示子对象的属性

如图  不是用formatter则显示的是来个[object object] 但是前台已经传过来值

有俩种方法来使用

第一种是 在js里面直接利用formatter来进行获取

$(function() {
		$("#tt")
				.datagrid(
						{
							pageSize : 2,//每页显示的记录条数，默认为5  
							pageList : [ 2, 4, 6, 8, 10 ],//可以设置每页记录条数的列表
							beforePageText : '第',//页数文本框前显示的汉字   
							afterPageText : '页    共 {pages} 页',
							displayMsg : '第{from}到{to}条，共{total}条',
							columns : [ [
									{
										title : '序号',
										field : 'g_id',
										halign : 'center',
										align : 'center',
										width : 100,
										id : 'typ',
									},
									{
										title : '商品名称',
										field : 'g_name',
										halign : 'center',
										align : 'center',
										width : 100,
									},
									{
										title : '商品货号',
										field : 'g_sn',
										halign : 'center',
										align : 'center',
										width : 100,
									},
									{
										title : '商品数量',
										field : 'g_num',
										halign : 'center',
										align : 'center',
										width : 100,
									},
									{
										title : '商品市场价',
										field : 'g_mprice',
										halign : 'center',
										align : 'center',
										width : 100,
									},
									{
										title : '商城价格',
										field : 'g_ipcice',
										halign : 'center',
										align : 'center',
										width : 100,
									},
									{
										title : '商城简介',
										field : 'g_desc',
										halign : 'center',
										align : 'center',
										width : 100,
									},
									{
										title : '是否上架',
										field : 'g_isshow',
										halign : 'center',
										align : 'center',
										width : 100,
									},
									{
										title : '关联图片路径',
										field : 'im_id',
										halign : 'center',
										align : 'center',
										width : 100,
										formatter:function(value,row,index){
					                                            return row.im_id.i_path;
									        }
									},
									{
										title : '所属分类',
										field : 'gid',				

//关键代码  需要注意的是需要用  gid 来引用 t_name才能得到值

                                         formatter:function(value,row,index){                      return row.gid.t_name;                       }, halign : 'center',align : 'center',width : 100,},{title : '操作',field : 'action',halign : 'center',align : 'center',width : 200,formatter : function(value, row, index) {if (row.editing == true) {return "<a href='#' οnclick='saveRow("+ index+ ");'>确定</a>  <a href='#' οnclick='reDo("+ index + ");'>取消</a>";} else {return "<a href='#' οnclick='return updateRow();'>修改</a>   <a href='#' οnclick='return deleteRow();'>删除</a>";}}} ] ],});});</script>

   

 body

                <h2>商品列表</h2>
		<table id="tt" class="easyui-datagrid"
			style="width: 1035px; height: 250px" title="分类列表"
			data-options="rownumbers:true,singleSelect:true,pagination:true,url:'shopSelectAll',method:'get'">
			<!--要想显示分页控件，pagination属性必须为true  -->
		</table>

第二种在body引用js方式来获取formatter你想得到的属性

body

	<a href="TypeDemo">点击返回主页</a>
		<h2>电脑配件列表</h2>
		<table id="tt" class="easyui-datagrid"
			style="width: 600px; height: 250px" title="电脑配件列表"
			data-options="rownumbers:true,singleSelect:true,pagination:true,url:'selectprats',method:'get'">
			<!--要想显示分页控件，pagination属性必须为true  -->
			<thead>
				<tr>
					<th field="p_id" width="80" align="center">序号</th>
					<th field="p_name" width="130" align="center">配件名称</th>
					<th data-options="field:'t_id',width:130,align:'center',formatter:formatPrice">配件类型</th>
					<th field="ml" width="130" align="center">容量</th>
					<th field="price" width="100" align="center">价格</th>
				</tr>
			</thead>
		</table>

js代码

<script type="text/javascript">
	function formatPrice(val, row) {
		return val.t_name;
	}</script>

效果图