Dojo Examples – II

1. Getting Data

Create one sample file to load in and name it as sample.txt with below text
I am a <em>remote</em> file.
We used Dojo(Ajax) to put text
in our page

<!DOCTYPE html PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN” “http://www.w3.org/TR/html4/loose.dtd”>
<html>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=ISO-8859-1″>
<title>Getting data with Dojo</title>
<!– load the dojo toolkit base –>
<script type=”text/javascript” src=”dojo/dojo.js”
djConfig=”parseOnLoad:true, isDebug:true”></script>
<script type=”text/javascript”>
var init = function(){
var contentNode = dojo.byId(“content”);
dojo.xhrGet({
url: “sample.txt”,
handleAs: “text”,
load: function(data,args){
// fade out the node we’re modifying
dojo.fadeOut({
node: contentNode,
delay: 2000,
onEnd: function(){
// set the data, fade it back in
contentNode.innerHTML = data;
dojo.fadeIn({node: contentNode}).play();
}
}).play();
},
// if any error occurs, it goes here:
error: function(error,args){
console.warn(“error!”,error);
}

// single handle argument is used instead of both load & error
handle: function(data,args){
if(typeof data == “error”){
console.warn(“error!”);
console.log(args);
}else{
dojo.fadeOut({
node: contentNode,
delay: 2000,
onEnd: function(){
// set the data, fade it back in
contentNode.innerHTML = data;
dojo.fadeIn({node: contentNode}).play();
}
}).play();
}
}
});
};
dojo.addOnLoad(init);
</script>
<style type=”text/css”>
container {
border:1px dotted #b7b7b7;
background:#ededed;
width:75px;
height:55px;
}
</style>
</head>

<body>
<div id=”container” class=”box”>
<div id=”content”>
I am some Inner Content.
I am going to be replaced
</div>
</div>
</body>
</html>

Advertisements

One Response

  1. This is very innovative site.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: