页面部分： <%@ page language="java" pageEncoding="UTF-8"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>对话框案例</title> <style type="text/css"> @import "js/dojo-release-1.1.0/dojo/resources/dojo.css"; @import "js/dojo-release-1.1.0/dijit/themes/tundra/tundra.css"; </style> <script type="text/javascript" djConfig="par
SEOnLoad: true" src="js/dojo-release-1.1.0/dojo/dojo.js"></script> <script type="text/javascript"> dojo.require("dijit.Dialog"); dojo.require("dijit.form.Text
Box"); dojo.require("dijit.form.Button"); </script> </head> <body class="tundra"> <button dojoType="dijit.form.Button" onClick="dijit.byId('loginDialog').show()">
显示登陆对话框</button> <div id="showData"></div> <div dojoType="dijit.Dialog" id="loginDialog" title="
用户登陆"> <form id="dialogForm" method="post"> <table> <tr> <td> <label>
用户名</label> </td> <td> <input dojoType="dijit.form.Text
Box" type="text" name="username"> </td> </tr> <tr> <td> <label>密 码</label> </td> <td> <input dojoType="dijit.form.Text
Box" type="password" name="password"> </td> </tr> <tr> <td colspan="2" align="right"> <button dojoType="dijit.form.Button">登陆 <script type="dojo/method" event="onClick"> function dialogCallBack(data,params){ dojo.byId("showData").innerHTML = data; } function dialogError(data,params){ dojo.byId("showData").innerHTML = "服务器
错误"; } dojo.xhrPost({ url:'./login.do',load:dialogCallBack,error:dialogError,form:'dialogForm',encoding:'utf-8' }); </script> </button> </td> </tr> </table> </form> </div> </body> </html>
后台部分： package org.sp.struts.action; import java.io.IOException; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import org.apache.struts.action.Action; import org.apache.struts.action.ActionForm; import org.apache.struts.action.ActionForward; import org.apache.struts.action.ActionMapping; /** *
登录后台 * @author 无尽de华尔兹 * */ public class LoginAction extends Action { public ActionForward execute(ActionMapping mapping,ActionForm form,HttpServletRequest request,HttpServletResponse response) throws IOException { request.setCharacterEncoding("utf-8"); response.setCharacterEncoding("utf-8"); String username = request.getParameter("username"); String password = request.getParameter("password"); response.getWriter().write(username + " " + password); return null; } } dojo 1.1.0 学习总结 三. 对话框案例 1.导入CSS样式 <style type="text/css"> @import "js/dojo-release-1.1.0/dojo/resources/dojo.css"$$ @import "js/dojo-release-1.1.0/dijit/themes/tundra/tundra.css" </style> 2.
添加dojo.js库 <script type="text/javascript" djConfig="par
SEOnLoad: true" src="js/dojo-release-1.1.0/dojo/dojo.js"></script> 3.导入组件 <script type="text/javascript"> dojo.require("dijit.Dialog"); dojo.require("dijit.form.Text
Box"); dojo.require("dijit.form.Button"); </script> 4.弹出型对话框 a.按钮事件，用于
显示对话框 <button dojoType="dijit.form.Button" onClick="dijit.byId('loginDialog').show()">
显示登陆对话框</button> b.对话框层 <div dojoType="dijit.Dialog" id="loginDialog" title="
用户登陆"> <form id="dialogForm" method="post"> <table> <tr> <td> <label>
用户名</label> </td> <td> <input dojoType="dijit.form.Text
Box" type="text" name="username"> </td> </tr> <tr> <td> <label>密 码</label> </td> <td> <input dojoType="dijit.form.Text
Box" type="password" name="password"> </td> </tr> <tr> <td colspan="2" align="right"> <button dojoType="dijit.form.Button">登陆 <script type="dojo/method" event="onClick"> function dialogCallBack(data,encoding:'utf-8' }); </script> </button> </td> </tr> </table> </form> </div> 注: 该对话框层类型使用 dojoType="dijit.Dialog" id="loginDialog" title="
用户登陆"
标题栏
内容 其他完全和表单同样使用 5.
提示型对话框 <div dojoType="dijit.form.DropDownButton"> <span>
显示登陆
提示对话框</span> <div dojoType="dijit.TooltipDialog" id="loginTipDialog" title="登陆
提示对话框"> <form id="dialogForm" method="post"> <table> <tr> <td> <label>
用户名 </label> </td> <td> <input dojoType="dijit.form.Text
Box" type="text" name="username"> </td> </tr> <tr> <td> <label> 密 码 </label> </td> <td> <input dojoType="dijit.form.Text
Box" type="password" name="password"> </td> </tr> <tr> <td colspan="2" align="right"> <button dojoType="dijit.form.Button"> 登陆 <script type="dojo/method" event="onClick"> function dialogCallBack(data,encoding:'utf-8' }); </script> </button> </td> </tr> </table> </form> <div> 也可以用文本注释工具的
内容 </div> </div> </div> 注： 第一层使用类型 dojoType="dijit.form.DropDownButton" 表示是一个按钮或
菜单层，当单击时它会
自动显示内层的对话框 <span>
显示登陆
提示对话框</span>作为按钮的
显示文本 第二层，即内嵌在其中的对话框 类型为 dojoType="dijit.TooltipDialog" title="登陆
提示对话框" 表示对话框的注释 其他和使用弹出对话框一样。
