表格列排序样例

1.样例说明

本例通过配置方式和代码方式来实现分录列的可排序

(1) 本例演示了列排序效果

(2) 列属性中的sortable=true就可以达到列排序的效果

(3) 列排序的图标在表头创建时就已经构造所以使用代码方式设置时需要在页面渲染前修改

2.配置方式

选中对应的列设置必输为是:
表格必输配置

3.代码方式

3.1 配置页面渲染事件的before插入事件:
表格必输配置

3.2 实现脚本中生成的页面方法:

    pageOnRenderBeforeCL:function(e){
      _self.setInitComponentCallBack(function(cmpType,option,dom){ 
      	if(cmpType === "grid" && option.id === "editGrid2"){
        	option.colModel[9].sortable = true; //修改审批金额的列配置
        }
      });
  }

4.注意事项

4.1 分录列是f7类型时仅配置sortable是不够的,因为f7是一个对象没办法给一个对象排序只能根据对象的某一个字段排序,所以需要设置f7排序的字段即该列排序时以哪一个f7字段为排序字段

4.2 配置页面打开事件的after插入事件:
表格必输配置

4.3 页面打开事件的after插入中设置f7列的排序字段:

    pageOnLoadAfterCL:function(e){
	   var sorttypeField = function(value){
	        return $.wafPromptBox.format(value,"{name}"); // 得到name字段的值
	   }
	   waf("#editGrid2").wafGrid("getColumnConfig","payType").sorttype= sorttypeField;
	}

相关样例