RowExpander 格式化模板的数据

定义模板:

this.expander = new Ext.ux.grid.RowExpander({
            tpl : new Ext.Template(
                '<table border="0" cellspacing="1" cellpadding="0" class="area-text-tab">',
                  '<tr>',
                    '<th>特征特性:</th>',
                    '<td>{feature:ellipsis(1000)}</td>',
                  '</tr><tr>',
                    '<th>蛋白质:</th>',
                    '<td>{protein:ellipsis(1000)}</td>',
                  '</tr><tr>',
                    '<th>组织来源:</th>',
                    '<td>{organism:ellipsis(1000)}</td>',
                  '</tr></table>'
                )
        });

 

使用插件:

this.cm = new Ext.grid.ColumnModel({
            defaults: {
                locked: false,
                sortable: true
            },
            columns:[this.expander,{
                locked: true,
                width:210,
                dataIndex:"gi",header:"gi"
            }

                ...

            ]

})

 

plugins: this.expander,

 

 {feature:ellipsis(1000)} 截取1000字

 

tpl : new Ext.Template(
                    '<table border="0" cellspacing="1" cellpadding="0" class="area-text-tab">',
                    '<tr>',
                    '<th>采集人</th><td>{gatherer}</td><th>采集日期</th><td>{collectionDate:date("Y-m-d")}</td>',
                    '<th>采集地点</th><td colspan="3">{collectionLocation}</td><th>年龄</th><td>{age}</td><th>器官</th><td>{organ}</td>',
                    '</tr>',
                    '<tr>',
                    '<th>保存组织</th><td>{storageOrganization}</td><th>保存温度</th><td>{storageTemperature}</td>',
                    '<th>保存方法</th><td>{storageMethods}</td><th>实物状态</th><td>{physicalStatus}</td>',
                    '<th>共享方式</th><td>{shareMode}</td><th>雌雄</th><td>{maleorFemale:this.fmMOrF}</td>',
                    '</tr>',
                    '<tr>',
                    '<th>托管人姓名</th><td>{trusteePerson}</td><th>托管人单位</th><td>{trusteeUnits}</td>',
                    '<th>托管人所在单位</th><td>{trusteeSubject}</td><th>托管人联系电话</th><td>{trusteePhone}</td>',
                    '<th>托管人联系方式</th><td width="430" colspan="3">{trusteeContact}</td>',
                    '</tr>',
                    '</table>',
                    {fmMOrF  : function(value) {
                        return value=='M' ? '雌' : '雄';
                    }}
            )

 

自定义格式化'雌' : '雄'

 

格式化日期:{collectionDate:date("Y-m-d")}

 

这是一份格式化函数的列表,可用于模板

ellipsis(length) - 对大于指定长度部分的字符串,进行裁剪,增加省略号(“...”)的显示。适用于只显示前N位的字符,然后提供详细页面的场合。 
undef -检查一个值是否为underfined,如果是的转换为空值 
htmlEncode - 转换(&, <, >, and ') 字符 
trim - 对一段文本的前后多余的空格裁剪 
substr(start, length) - 返回一个从指定位置开始的指定长度的子字符串。 
lowercase - 返回一个字符串,该字符串中的字母被转换为小写字母。 
uppercase - 返回一个字符串,该字符串中的字母被转换为大写字母。 
capitalize - 返回一个字符串,该字符串中的第一个字母转化为大写字母,剩余的为小写。 
usMoney - 格式化数字到美元货币。如:$10.97 
date[(format)] - 将一个日期解析成为一个特定格式模式的日期。如日期字符串不输入,默认为“月/日/年” 
stripTags - 剥去变量的所有HTML标签

posted @ 2012-05-18 09:32  Jake.Xu  阅读(416)  评论(0编辑  收藏  举报