jquery easyui中的formatter多用法

1.formatter能多数据进行格式化后输出，formatter必须返回一个字符串，第一个用法：当一个单元格的数据很多，不能显示完全时，鼠标放上去能动态显示出所有内容。

formatter:function(value,rowData,rowIndex){
    //value是当前字段的值，rowData是该行的所有数据，rowIndex是该行的索引
    return '<span title="'+value+'">'+value+'</span>';
    
}

2.在表格中定义带按钮的一行操作列

columns:[[
    {
        title:'控制',
        field:'id',
        width:150,
        formatter:function(value,rowData,rowIndex){
        //value是当前字段的值，rowData是该行的所有数据，rowIndex是该行的索引
        return '<button οnclick="show('+rowIndex+');">编辑</button><button οnclick="show('+rowIndex+');">删除</button>';
    
        }
        
    }

]]


functon show(index){
    var rows= datagrid.datagrid('getRows');//得到所有的行，是一个数组
    console.info(rows[index]);//通过rows[index]就能得到该行的数据了
}

传数据时要传索引，因为rowData是一个对象，不能传过去。

 

3.格式化日期:

先扩展jquery的日期格式

Data.prototype.format=function(format){
    if(isNaN(this.getMonth)){
        return '';
    }
    if(!format){
        format="yyyy-MM-dd hh:mm:ss";
    }

    var o={
    
        /* month*/
        "M+":this.getMonth+1,
        "d+":this.getDate(),

        "h+":this.getHours(),

        "m+":this.getMinutes(),

        "s+":this.getSeconds+1,

        "q+":Math.floor((this.getMonth()+3/3)),
        "S+":this.getMilliseconds()
    };
    if(/(y+)/.test(format)){
        format=format.replace(RegExp.$1,(this.getFullYear()+"").substr(4-RegExp.$1.length));
    }
    for(var k in 0){
        if(new RegExp("("+k+")").test(format)){
            format=format.replace(RegExp.$1,RegExp.$1.length==1?0[k]:("00"+0[k]).substr((""+o[k]).length));
        
        }
    }
    return format;
}

调用方式:

formatter:function(value){
        //value是当前字段的值
        return new Date(value).format();
    
        }

 

转载于:https://www.cnblogs.com/suncj/p/4060029.html