<!DOCTYPE html>
<html>
<head>
    <title>ExtJs</title>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <link rel="stylesheet" type="text/css" href="ExtJs/packages/ext-theme-crisp/build/resources/ext-theme-crisp-all.css">
		<script type="text/javascript" src="ExtJs/ext-all.js"></script>
		<script type="text/javascript" src="ExtJs/bootstrap.js"></script>
		<script type="text/javascript" src="ExtJs/packages/ext-theme-crisp/build/ext-theme-crisp.js"></script>

    <script type="text/javascript">
			Ext.onReady(function(){
        var tpl1 = new Ext.XTemplate(
          '<table border=1 cellpadding=1 cellspacing=1>',
          '<tr><td width=90>姓名</td><td width=90>工资</td></tr>',
          '<tpl for=".">',
          '<tpl if="this.check(wage)">',
          '<tr><td>{name}</td><td>{[this.format(values.wage)]}</td></tr>',
          '</tpl></tpl>',
          '</table>',
          {
            check: function(wage) {
              if (wage >1000){
                return true;
              }else {
                return false
              }
            },
            format: function(wage){
              if(wage> 1300){
                return '<font color=red>' + wage + '</font>';
              }else {
                return '<font color=blue>' + wage + '</font>';
              }
            }
          }
        );
        var tplData = [
          {name: '张三', wage: 1320},
          {name: '郴四', wage: 1200},
          {name: '五爷', wage: 1556},
          {name: '老炮', wage: 1134},
          {name: '学军', wage: 1822}
        ]
        tpl1.append('tpl-table1', tplData);

      });
    </script>
</head>
<body>
<div id='tpl-table1'></div>
<br>
<div id='tpl-table2'></div>
</body>
</html>

  

最新文章

  1. 【原】javascript执行环境及作用域
  2. chkconfig用法 LINUX
  3. 关于Java单例
  4. FDR
  5. A Product Array Puzzle
  6. Struts标签、Ognl表达式、el表达式、jstl标签库这四者之间的关系和各自作用
  7. Nginx端口的修改
  8. 数据结构之数组Array
  9. 自己做jQuery插件:将audio5js封装成jQuery语音播放插件
  10. phalcon
  11. android文件下载大小和网络不一致(偏大)
  12. 响应式布局中的CSS相对量
  13. Java中实现十进制数转换为二进制的三种思路
  14. Mysql5.7.20使用group by查询(select *)时出现错误--修改sql mode
  15. 自动化运维工具---expec
  16. 获取input Date日期 时间,并得到前一天的Date值
  17. UVA10562(看图写树,dfs)
  18. Educational Codeforces Round 1
  19. 【Python】数据库练习-2
  20. search的 制作

热门文章

  1. [ajax 学习笔记] ajax初试
  2. oc14--匿名对象
  3. Camera-hal参数调整
  4. 在ubuntu中安装与配置zsh与oh-my-zsh
  5. JavaScript --晋级--优
  6. POJ 2337 欧拉回路
  7. Unity3d gameObject
  8. 第5章分布式系统模式 使用服务器激活对象通过 .NET Remoting 实现 Broker
  9. P1034 矩形覆盖
  10. sql多表关联