Messing around with Dojo has been great fun, sometimes frustrating with the latest 0.9 Dojo release and the lack of documentation. But, after much picking at my script, I was able to create simple forms, send them and receive information through Dojo’s xhrGet function.
Include the following code within the <head> and </head> tags of your document.
<code>
<script type=”text/javascript” src=”/path to dojo/dojo.js” djConfig=”parseOnLoad:true”></script>
</code>
Include the form widgets you would like to use. I have the basics below:
<code>
<script type=”text/javascript”>
dojo.require(“dijit.form.TextBox”);
dojo.require(“dijit.form.CheckBox”);
dojo.require(“dijit.form.Button”);
</code>
Don’t forget the parser
<code>
dojo.require(“dojo.parser”);
</code>
Now for our main function
<code>
function getFormData() {
var kw = {
url: “/path to your php page handler/pagename.php”, //Explicit Path – leaving out the leading / seemed to break the code
load: function(data){
dojo.byId(‘formdata’).innerHTML = data; // where do you want your data to be returned.
},
error: function(data){
alert(“An error occurred: ” + data); //in case of error
},
timeout: 2000,
form: “login” //what form
};
dojo.xhrGet(kw);
}
</code>
A Simple Form:
<code>
<div id=”formdata”>
<form name=”login” id=”login” method=”GET”>
<label for “user_name”>User Name</label>
<input id=”user_name” type=”text” name=”user_name”
dojoType=”dijit.form.TextBox” />
<label for “password”>Password</label>
<input id=”password” type=”password” name=”password”
dojoType=”dijit.form.TextBox” />
<button dojoType=”dijit.form.Button” onclick=”sendFormData()”>
Submit
</button>
</form>
</div>
</code>
Create your PHP Page:
<code>
<?
echo “Hello “.$_REQUEST[user_name].”. Your password is: “.$_REQUEST[password].”;
?>
</code>
Complete your form and click submit.