欢迎访问中国最大的EXTJS讨论社区 首页 论坛 教程

Ext教程-一起Ext

当前位置: 首页 > 教程 > DOJO教程 >

用dojo实现最简单的页面局部刷新功能

时间:2009-04-09 15:11来源:未知 作者:admin 点击:
刚刚开始学习dojo框架,一个让人很舒服的javascript框架,做了个局部刷新的功能,分享如下: Dojo是一个用JavaScript语言实现的开源DHTML工具包。它是在几个项目捐助基础上建立起来的(nW

  刚刚开始学习dojo框架,一个让人很舒服的javascript框架,做了个局部刷新的功能,分享如下:

Dojo是一个用JavaScript语言实现的开源DHTML工具包。它是在几个项目捐助基础上建立起来的(nWidgets, Burstlib, f(m)),这也是为什么叫它a unified toolkit的原因。Dojo的目标是解决开发DHTML应用程序遇到的那些、长期存在 、历史问题,以及DHTML 跨浏览器问题。
  Dojo能够让你更容易使Web页面具有动态能力,或者在任何能够稳定支持JavaScript语言的环境中发挥作用。
  Dojo有以下的特征:
  1、利用Dojo提供的组件,你可以提升你的web应用程序可用性、交互能力以及功能上的提高。
  2、也可以更容易的建立互动的用户界面。同时Dojo提供小巧的动态处理工具。
  3、利用它的低级API和可兼容的代码,能够写出轻便的、单一风格(复杂)的JavaScript代码。Dojo的事件系统、I/O的API以及通用语言形式是基于一个强大编程环境。
  4、通过Dojo提供的工具,你可以为你的代码写命令行式的单元测试代码。
  5、Dojo的扩展包能够使你自己的代码更容易维护,耦合性更低。
  Dojo通过很少的代码完成了以上的功能。当你写脚本时,只需要包含很少的js文件,也可以选择的(包含)下载dojo提供的庞大的功能。

1.导入dojo的所有js文件

2.写触发事件:如

<select name="holiday" onchange="javascript:takeobject();">                                                             <option value="h1,15">年假(15天)</option>
</select>

点这个控件时,<input type="text" name="days"/>这个文本框会显示剩余年假的天数,页面其他部分不变

takeobject方法:

<script>
     
      function takeobject(){
        searchObject(document.osform[\'holiday\'].value);     
      }
       
</script>

改页面导入的文件

<script language="JavaScript" type="text/javascript" src="../js/dojo/dojo.js"></script>
<script language="JavaScript" type="text/javascript" src="../test/js/jsutil.js"></script>

而searchObject方法是写在jsutil.js文件中

3.jsutil.js

function searchObject(holiday){
     var bindArgs = {
     url: "/leave/oswf/testflow.do?task=takeobject&holiday="+holiday,
     
      mimetype: "text/javascript",
      load: function(type, data, evt){
       dj_eval(data);
       //dojo.DEBUG("print",data);
      
      },
      error: function(type, data, evt){
       alert("get error");
      },
      timeoutSeconds: 500,
      timeout: function(){
       alert("timeout");
      }
     };
     dojo.io.bind(bindArgs);
}

这个文件主要关注红色部分,任何应用只要更改红色部分就ok

4.java类中写takeobject方法

public ActionForward takeObject(ActionMapping mapping, ActionForm form,
    HttpServletRequest request, HttpServletResponse response){

//得到上面传过来的值
  String holiday = request.getParameter("holiday");
//这里可以写业务处理代码

... ...

//转向一个jsp页面
  return mapping.findForward("takeobject");
}

5.takeobject.jsp

<%@ page language="java" pageEncoding="UTF-8"%>
<jsp:directive.page import="java.math.BigDecimal"/>

声明:本站教程文章版权为一起Ext(http://www.17ext.com/)所有,转载请注明出处
顶一下
(0)
0%
踩一下
(0)
0%
------分隔线----------------------------
最新评论 查看所有评论
发表评论 查看所有评论
请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
评价:
表情:
用户名: 密码: 验证码:
推荐内容