ExtJS Grid的两个格式处理方法

1. 使Grid内容可复制

  • 加入CSS

<style type="text/css">
.x-selectable, .x-selectable * {                
 -moz-user-select: text !important;                 
-khtml-user-select: text !important;     
-webkit-user-select: text !important; }  
.x-grid-row td, 
.x-grid-summary-row td, 
.x-grid-cell-text, 
.x-grid-hd-text, 
.x-grid-hd, 
.x-grid-row,  
.x-grid-row, 
.x-grid-cell, 
.x-unselectable {     
-moz-user-select: text !important;     
-khtml-user-select: text !important;     
-webkit-user-select: text !important; }

  • 修改javascript,在gridpanel里添加属性

viewConfig: {     
    disableSelection: true,     
    stripeRows: false,     
    getRowClass: function(record, rowIndex, rowParams, store){         
        return "x-selectable";     
    } 
}, 

2. 使Grid内单元格内容自动换行

方法一:为单元格加入renderer方法

function textRenderer(value, metadata, record) {
		metadata.attr = 'style="white-space:normal;"';
		return value;
	}

如果有必要,把grid的forcefit设为false。


方法二:加入css

.x-grid3-cell-inner, .x-grid3-hd-inner{  
     overflow:hidden;  
     -o-text-overflow: ellipsis;  
     text-overflow: ellipsis;  
     padding:3px 3px 3px 5px;  
     /*white-space: nowrap;*/  
     white-space:normal !important;   
}


你可能感兴趣的:(JavaScript,function,ExtJs)