1.
1 <%@ page language="java" contentType="text/html; charset=UTF-8" 2 pageEncoding="UTF-8"%> 3 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 4 <html> 5 <head> 6 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 7 <title>选项卡组织表单</title> 8 <style type="text/css"> 9 @import "js/dijit/themes/tundra/tundra.css"; 10 @import "js/dojo/resources/dojo.css" 11 </style> 12 <script type="text/javascript" 13 src="js/dojo/dojo.js" 14 djConfig="parseOnLoad: true"></script> </head> 15 <script type="text/javascript"> 16 dojo.require("dojo.parser"); 17 dojo.require("dijit.layout.ContentPane"); 18 dojo.require("dijit.layout.TabContainer"); 19 dojo.require("dijit.form.ValidationTextBox"); 20 dojo.require("dijit.form.DateTextBox"); 21 </script> 22 <style> 23 .formContainer { 24 width:600px; 25 height:600px; 26 } 27 label { 28 width:150px; 29 float:left; 30 } 31 </style> 32 <body class="tundra"> 33 <!-- 34 dojoType="dijit.form.ValidationTextBox" 验证组件 35 trim="true" 去除首尾空格 36 propercase="true" 自动将首字母大写 37 required="true" 必填项 38 dojoType="dijit.form.DateTextBox" 39 --> 40 <div class="formContainer" dojoType="dijit.layout.TabContainer"> 41 42 <div dojoType="dijit.layout.ContentPane" title="Personal Data"> 43 <label for="first_name">First Name:</label> 44 <input type="text" name="first_name" id="first_name" 45 dojoType="dijit.form.ValidationTextBox" trim="true" 46 propercase="true" required="true" size="30" 47 invalidMessage="You must enter your first name" /><br/> 48 <label for="last_name">Last Name:</label> 49 <input type="text" name="last_name" id="last_name" size="30" 50 dojoType="dijit.form.ValidationTextBox" trim="true" 51 propercase="true" required="true" length="30" 52 invalidMessage="You must enter your last name"/><br/> 53 <label for="middle_initial">Middle Initial:</label> 54 <input type="text" name="middle_initial" id="middle_initial" 55 size="1" /><br/> 56 <label for="email">Email:</label> 57 <input type="text" name="email" id="email" size="30" 58 dojoType="dijit.form.ValidationTextBox" regExp=".*@.*" 59 /> 60 </div> 61 <div dojoType="dijit.layout.ContentPane" title="Address"> 62 <label for="address_line_1">Address Line 1:</label> 63 <input type="text" name="address_line_1" id="address_line_1" 64 size="30" /><br/> 65 <label for="address_line_2">Address Line 2:</label> 66 <input type="text" name="address_line_2" id="address_line_2" 67 size="30" /><br/> 68 <label for="city">City:</label> 69 <input type="text" name="city" id="city" size="30" /><br/> 70 <label for="state">State:</label> 71 <input type="text" name="state" id="state" size="2" /><br/> 72 <label for="postal_code">Postal Code:</label> 73 <input type="text" name="postal_code" id="postal_code" 74 size="15" /><br/> 75 <label for="country">Country:</label> 76 <input type="text" name="country" id="country" size="30" /><br/> 77 <label for="date_move">Date of Move to this Address:</label> 78 <input type="text" name="date_move" id="date_move" size="11" 79 dojoType="dijit.form.DateTextBox" /><br/> 80 </div> 81 <div dojoType="dijit.layout.ContentPane" title="Phones"> 82 <label for="home_phone">Home Phone:</label> 83 <input type="text" name="home_phone" id="home_phone" 84 size="30" /><br/> 85 <label for="work_phone">Work Phone:</label> 86 <input type="text" name="work_phone" id="work_phone" 87 size="30" /><br/> 88 <label for="cell_phone">Cell Phone:</label> 89 <input type="text" name="cell_phone" id="cell_phone" 90 size="30" /><br/> 91 </div> 92 </div> 93 </body> 94 </html>
