Print Page - Why not use template binding for the datagrid columns？

Now:

Code:

<table id='grid'>
    <thead>
      <tr>
        <th data-options="field:'id'">ID</th>
        <th data-options="field:'sex', formatter:formatSex">Sex</th>
      </tr>
    </thead>
</table>
<script>
    function formatSex(value,row,index){
        if(value==0){
            return "Female";
        }
        else if(value==1){
            return "Male";
        }

        return "Unknown";
    }
</script>

I want to like this:

HTML

Code:

<table id='grid'>
    <thead>
      <tr>
        <th data-options="field:'id'">ID</th>
        <th data-options="field:'name', template:'<span style="color:red;"><%=name%></span>'">Name</th>
        <th data-options="field:'sex', template:'<%=sex?"BOY":"GIRL"%>'">Sex</th>
        <th data-options="field:'age', template:'<%=age||"-"%>'">Age</th>
        <th data-options="field:'group', template:'<%=class+"_"+group%>'">Group</th>
        <th data-options="field:'id', template:'<a onclick="Edit(<%=id%>)">Edit</a><a onclick="Delete(<%=id%>)">Delete</a>'">Op</th>
      </tr>
    </thead>
</table>

ps:'<' escape '<'
'>' escape '>'
'"' escape '"'

JAVASCRIPT

Code:

$(#grid).datagrid({
    data:[
        {id:1, name:"zhangsan", sex:true, age:20, class:'class1', group:'group1'},
        {id:2, name:"lisi", sex:true, age:21, class:'class1', group:'group2'},
        {id:3, name:"wangwu", sex:true, age:22, class:'class2', group:'group1'},
        {id:4, name:"zhaoliu", sex:true, age:23, class:'class2', group:'group2'},
        {id:5, name:"suqi", sex:true, age:24, class:'class2', group:'group3'}
    ]
});

EasyUI Forum

General Category => EasyUI for jQuery => Topic started by: jiangzm on June 26, 2014, 04:46:43 AM