Ingeniero

Hoja de ejercicios 5

Dojo Toolkit
Ejercicio 1
1. Descargamos la última versión de dojo (1.6) de la pagina http://dojotoolkit.org/
(release zip)
2. Descomprimimos el zipeado y veremos las 3carpetas: dojo, dijit y dojox. Copiamos las
3 carpetas a nuestra carpeta donde trabajaremos.
3. Creamos 3 : css, images y js (en este ultimo copiamos el dojo toolkit) y creamos el
archivoejercicio1.html . Deberia quedarnos como nos muestra en la siguiente pantalla

4. Editamos nuestro ejercicio1.html





Ejercicio 1: Hola Dojo!



dojo.ready(function(){dojo.byId("saludo").innerHTML += ", desde la version " + dojo.version;
});



Hola mundo



5. Ejecutamos nuestro html

Ejercicio 2
1. Creamos nuestro archivo ejercicio2.html a la misma altura.
2.Agregamos el siguiente código




Ejercicio 2: addOnLoad Dojo!



var init = function()
{
dojo.byId("saludo").innerHTML += ", devsdsdvsde la version " + dojo.version;
}
dojo.addOnLoad(init);Hola mundo



3. Nos mostrara la misma pantalla

Ejercicio 3
1. Creamos nuestro ejercicio3.html
2. Agregamos el siguiente código





Ejercicio 3: Dijit!
dojo.require("dojo.parser");
dojo.require("dijit.form.Button");
dojo.require("dijit.form.TextBox");
var init = function()
{
dojo.connect(
dojo.byId('btnDiHola'),
"onclick",
this,
helloButton_onClick);
}
// el escuchador del evento del boton
var helloButton_onClick = function(event)
{
alert('Hola ' +
dojo.byId('txtName').value + '!');
}
// start
dojo.addOnLoad(init);



Ingresatu nombre:


Di hola



3.

Ejecutamos y nos mostrara los siguiente

Ejercicio 4
1.
2.

Creamos el archivo ejercicio4.html
Agregamos el siguiente código






body, html {font-family:helvetica,arial,sans-serif; font-size:90%; }




dojo.require("dojox.charting.Chart2D");
dojo.require("dojox.charting.themes.Wetland");
dojo.addOnLoad(function() {
var c = new...