您的位置：首页 > 产品设计 > UI/UE

easyUI dategrid field 用formatter显示子属性

2015-04-01 22:45 176 查看
dategrid：

<body class="easyui-layout"  data-options="fit:true,border:false">
<table id="dg" class="easyui-datagrid" data-options="fit:true,border:false"
url="book/listBookForUser"
toolbar="#toolbar" pagination="true"
rownumbers="true" fitColumns="true" singleSelect="true">
<thead>
<tr>
<th field="bookId" width="50">书ID</th>
<th field="bookName" width="50">书名</th>
<th field="bookType" width="50" formatter="formatBookType">书类型</th>
<th field="author" width="50">作者</th>
<th field="callNumber" width="50">索书号</th>
<th field="iSBN" width="50">ISBN</th>
<th field="publisher" width="50">出版社</th>
<th field="publishYear" width="50">出版年份</th>
<th field="series" width="50">系列</th>
<th field="language" width="50">语言</th>
<th field="price" width="50">价格</th>
<th field="page" width="50">页数</th>
</tr>
</thead>
</table>


这里，book和bookType是多对一的关系，后台返回的json中，bookType又是一个json对象，要获得bookType的bookTypeName，不能直接用bookType.bookTypeName .所以在field的bookType字段加上formatter 。

function formatBookType(val,row,index){
//alert(row.bookType);
if(val==null){
return "";
}else
return row.bookType.bookTypeName;
}


val是该字段的值，即bookType。row是行值。这里注意,要加一个if为空的判断，因为我有的书籍没有设置类型，这样的话就会找不到类型名，造成整个date都没有显示数据了。
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航