jQuery MiniUI 开发教程 表格控件 表格：自定义单元格（三）

表格：自定义单元格

参考示例： 自定义单元格

监听处理"drawcell"事件
使用"drawcell"事件，可以自定义单元格内容、样式、行样式等。

grid.on("drawcell", function (e) {
    var record = e.record,
        column = e.column,
        field = e.field,
        value = e.value;

    //格式化日期
    if (field == "birthday") {
        if (mini.isDate(value)) e.cellHtml = mini.formatDate(value, "yyyy-MM-dd");

    }

    //给年龄，增加"岁"字符串
    if (field == "age") {
        e.cellHtml = value + "岁";
    }

    //给帐号列，增加背景色
    if (field == "loginname") {
        e.cellStyle = "background:#ecedef";
    }

    //超过1万工资，红色标识
    if (field == "salary" && value >= 10000) {
        e.cellStyle = "color:red;font-weight:bold;";
    }

    //显示学历
    if (field == "educational") {
        for (var i = 0, l = Educationals.length; i < l; i++) {
            var edu = Educationals[i];
            if (edu.id == value) {
                e.cellHtml = edu.name;
                break;
            }
        }
    }

    //action列，超连接操作按钮
    if (column.name == "action") {
        e.cellStyle = "text-align:center";
        e.cellHtml = '[url=javascript:edit(\'' + record.id + '\')]Edit[/url]  '
                    + '[url=javascript:del(\'' + record.id + '\')]Delete[/url]'
    }

    //将性别文本替换成图片
    if (column.field == "gender") {
        if (e.value == 1) {
            e.cellHtml = "<span class='icon-female'></span>"
        } else {
            e.cellHtml = "<span class='icon-boy'></span>"
        }
    }

    //设置行样式
    if (record.gender == 1) {
        e.rowCls = "myrow";
    }
});