Step 1: Initialize ate Dojo
Download the latest Dojo package from the http://www.dojotoolkit.org/downloads and place it somewhere in your project. For example, I put my dojo library under the lib folder (1 ).
Figure 1 (file directory structure)
Add the following code to your page to complete the most basic configuration.
<Script type = "text/javascript" src = "lib/dojo. js" djConfig = "parseOnLoad: true, isDebug: false"> </script>
Step 2: Start your First Example
My first example is to simulate a simple logon page. If the logon is successful, "Right!" is displayed !", Otherwise, "Wrong!" is displayed! Please try it again !"
Copy codeThe Code is as follows: <! Doctype html public "-// W3C // dtd html 4.01 // EN" "http://www.w3.org/TR/html4/strict.dtd">
<Html>
<Head>
<Meta http-equiv = "Content-Type" content = "text/html; charset = iso-8859-1">
<Title> Untitled Document </title>
<Script type = "text/javascript" src = "lib/dojo. js "src =" lib/dojo. js "djConfig =" parseOnLoad: true, isDebug: false "> </script>
<Style type = "text/css"> <! --
# Container {
Border: 1px dotted # b7b7b7;
Background: # ededed;
Width: 200px;
Height: 200px;
}
--> </Style> <style type = "text/css" bogus = "1"> # container {
Border: 1px dotted # b7b7b7;
Background: # ededed;
Width: 200px;
Height: 200px;
}
</Style>
</Head>
<Body>
<Form id = "mainForm" action = "controller/ajax-controller.php" method = "post">
<Label for = "name"> Name: </label>
<Input type = "text" name = "name"/>
<Br/>
<Label for = "password"> Password: </label>
<Input type = "password" name = "password" value = ""/>
<Br/>
<Input type = "submit" value = "Submit"/>
<H1 id = "resultText"> </Form>
<Script type = "text/javascript"> <! --
Var formSubmit = function (e ){
E. preventDefault ();
Var resultText = dojo. byId ("resultText ");
Dojo. xhrPost ({
Url: "controller/controller. php ",
Form: "mainForm ",
HandleAs: "text ",
Handle: function (data, args ){
Console.info (data );
If (typeof data = "error "){
ResultText. innerHTML = "<font color = \" red \ "> error! </Font> ";
} Else {
If (data = "right "){
ResultText. innerHTML = "Right! ";
} Else if (data = "wrong "){
ResultText. innerHTML = "<font color = \" red \ "> Wrong! Please try it again! </Font> ";
}
}
}
});
};
Dojo. addOnLoad (function (){
Var theForm = dojo. byId ("mainForm ");
Dojo. connect (theForm, "onsubmit", "formSubmit ");
});
// --> </Script>
</Body>
</Html>
(For the Dojo method, you can view the Dojo API. I will not repeat it here)
Php is used in the background. The Code is as follows:Copy codeThe Code is as follows: <? Php
If ($ _ POST ["name"] = "blithe" & $ _ POST ["password"] = "blithe "){
Print "right ";
} Else {
Print "wrong ";
}
?>
