Ext.Update.update实例-CFANZ编程社区

1：update.jsp代码

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>Ext.Update.update实例</title>
    
  <meta http-equiv="pragma" content="no-cache">
  <meta http-equiv="cache-control" content="no-cache">
  <meta http-equiv="expires" content="0">    
  <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
  <meta http-equiv="description" content="This is my page">
  
  <link rel="stylesheet" type="text/css" href="ext3.2/resources/css/ext-all.css"></link>
  <script type="text/javascript" src="ext3.2/adapter/ext/ext-base.js"></script>
  <script type="text/javascript" src="ext3.2/ext-all.js"></script>
  <script type="text/javascript" src="ext3.2/src/local/ext-lang-zh_CN.js"></script>
  
  <script type="text/javascript">
       Ext.onReady(function(){
        Ext.Updater.defaults.showLoadIndicator = false;  //不显示更新指示器
        var updater = Ext.get('content-div').getUpdater();   //得到元素的更新器
        var cusRender = function() {       //自定义渲染器
        this.render = function(el, response, updateManager, callback) {
          var time = el.query('input')[0];
          time.value = response.responseText;
        }  
        };
        
        updater.setRenderer(new cusRender());   //指定自定义的渲染器
        var btns = Ext.get('updateBtn');        //选择页面中id为updateBtn的元素
        btns.on('click', function() {
         update(); 
        });
        
        /**
         * 定义更新函数
         */
        function update() {
          updater.update({  //调用更新器的update方法，更新页面元素
            nocache: true,    //禁止缓存，这样才会每次都请求页面，Ajax二次请求同一个页面时取的是缓存数据
            url: 'ajaxTime.action'
          });
        }
      });
  </script>
  </head>
  <body>
     <div id="content-div">
        <input type="text" />
        <input type="button" name="updateBtn" value="更新时间"/>
     </div>
  </body>
</html>

2：Action中的代码

/**
   * 返回当前日期
   */
  public void ajaxTime() {
    SimpleDateFormat dateFormat = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss");
    Date date = new Date();
    String time = dateFormat.format(date);
    try {
      response.getWriter().write(time);
    } catch (IOException e) {
      e.printStackTrace();
    }
  }

3：程序效果图

必须设置Ext.Updater.defaults.showLoadIndicator = false来禁止显示提示信息，因为更新提示信息会覆盖更新元素的innerHTML内容，导致元素

内容被清空，对Ext.Updater.defaults属性的赋值必须出现在取得更新器之前，即getUpdater()之前，否则设置不会生效