MiniUI自定义列内容解决方案

背景

很多时候，我们需要自定义行内容。

方案

这个时候，就需要自定义列内容

源码

<div id="datagridTable" class="mini-datagrid" style="width:100%;min-height: 300px;" allowResize="true" idField="id" multiSelect="true"
     showEmptyText="true" emptyText="您好:系统暂无数据，请新增！">
        <div property="columns">
            <div type="indexcolumn" width="10" headerAlign="center">序号</div>      
            <div field="NAME" width="120" headerAlign="center" allowSort="false">车间名称</div>
            <div name="action" width="120" headerAlign="center" align="center" renderer="onActionRenderer" cellStyle="padding:0;">操作</div>  
        </div>
    </div>

// 自定义列内容
function onActionRenderer(e) {
    var grid = e.sender;
    var record = e.record;
    var uid = record._uid;
    var rowIndex = e.rowIndex;

    var s = '<a class="Edit_Button" href="javascript:upd(\'' + uid + '\')">编辑</a>'
            + '<a class="Delete_Button" href="javascript:del(\'' + uid + '\')">删除</a>';
               
    return s;
}

/*展示表单并回填数据到表单*/
function upd(row_uid){
    var row = grid.getRowByUID(row_uid);
    if (row) {
        showOrhideForm();
        var ret = row;
        for(var key in ret){
            $('input[name="'+key+'"]').val(ret[key]);
            $('textarea[name="'+key+'"]').text(ret[key]);
        }
    }
    
}

结束

源码中，操作列即可实现自定义列内容

原文地址：http://blog.51cto.com/zl0828/2116991