1:<html>
2:<head>
3: <title>Dojo Simple Form Example</title>
4: <meta name="keywords" content="dojo, javascript, web 2.0, ajax" />
5: <?php include($_SERVER['DOCUMENT_ROOT'] . "/in/cssblue.php"); ?>
6: <style type="text/css">
7: @import "/lib/dijit/themes/tundra/tundra.css";
8: @import "/lib/dojo/resources/dojo.css"
9: </style>
10: <script type="text/javascript" src="/lib/dojo/dojo.js"
11: djConfig="parseOnLoad: true"></script>
12: <script type="text/javascript">
13: dojo.require("dojo.parser");
14: dojo.require("dijit.form.Form");
15: dojo.require("dijit.form.Button");
16: dojo.require("dijit.form.ValidationTextBox");
17: </script>
18: <script type="text/javascript">
19:
20: function submitHdlr(){
21: if(dijit.byId("simpleForm").validate()){
22: dijit.byId("simpleForm").submit();
23: } else {
24: alert('Form contains invalid data. Please correct first');
25: }
26: }
27:
28: function resetHdlr(){
29: if (confirm('reset Form?')){
30: dijit.byId("simpleForm").reset();
31: }
32: }
33:
34:
35: function loader(){
36: dojo.connect(dojo.byId("ResetBtn"), 'onclick', resetHdlr);
37: dojo.connect(dojo.byId("SubmitBtn"), 'onclick', submitHdlr);
38:
39: }
40:
41: dojo.addOnLoad(loader); // Execute on load
42: </script>
43:</head>
44:<body class="tundra">
45:<?php include($_SERVER['DOCUMENT_ROOT'] . "/in/hdrex.php") ?>
46:
47:<!-- Page Content -->
48: <hr/>
49: <!------------- Example goes here ------------>
50: <h2>Dojo Simple Form Example</h2>
51: <div class="formBox">
52: <h4>Contact Info</h4>
53: <form dojoType="dijit.form.Form" method="post" action="request-helper.php"
54: id="simpleForm">
55: <label>First Name: </label><input type="text" maxlength="25" name="firstName"
56: dojoType="dijit.form.ValidationTextBox" required="true"
57: invalidmessage="Required field"/><br/>
58: <label>Last Name: </label><input type="text" maxlength="25" name="LastName"
59: dojoType="dijit.form.ValidationTextBox" required="true"
60: invalidmessage="Required field"/><br/>
61: <label>Phone: </label><input type="text" maxlength="25" name="studentId"
62: dojoType="dijit.form.ValidationTextBox" required="true"
63: regExp="\d\d\d-\d\d\d-\d\d\d\d" invalidmessage="Format is: xxx-xxx-xxxx"/><br/>
64: <br/>
65:
66: <div class="centerButton">
67: <button dojoType="dijit.form.Button" id="SubmitBtn">Submit </button>
68: <button dojoType="dijit.form.Button" id="ResetBtn">Reset </button>
69: </div>
70:
71: </form>
72:
73: </div>
74: <!------------- End of Example ------------>
75: <h3>Comments</h3>
76: <p>This page demonstrates the following about the <a href="http://dojotoolkit.org/" target="_blank">Dojo</a> JavaScript framework.</p>
77: <ul>
78: <li>Use the <code>dojo.addOnLoad</code> method to define a function handler for when the page loads.</li>
79: <li>Assign function handlers to events with <code>dojo.connect</code>.</li>
80: <li>Get handles to DOM elements with <code>dojo.byId</code>.</li>
81: <li>Get a handle to a Dojo widget using <code>dijit.byId</code>.</li>
82: <li>Validate, reset, or submit a form with Dojo.</li>
83: <li>Create Dojo enabled forms.</li>
84: <li>Validate form fields with the Dojo <code>ValidationTextBox</code>.</li>
85: </ul>
86: <p><a href="javascript:void(window.open('view-source:'+document.location, '_blank'))">View Source</a></p>
87:
88:
89: <hr/>
90:<!-- End Page Content -->
91:
92: <?php include($_SERVER['DOCUMENT_ROOT'] . "/in/ftrex.php") ?>
93: </body>
94:</html>