This is our first step to make our form example a HTML 5 compliant web page, we’ll need to make small modifications to our dojo toolkit widget’s tags. These will not be necesary until 2.0 when the actual notation eill be deprecated, but we can start our migration now.
First, download the full 1.6 version (3.7MB) of dojo and replace our old 1.5 files in /var/www/dojo (in ubuntu). Then acording to the data-attribute documentation -you may want to check the 1.6 release too- we need to:
- Change the doc type (<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01//EN” “http://www.w3.org/TR/html4/strict.dtd”>) to:
<!DOCTYPE htlm=“html“> - Change dojo config (src=”/dojo/dojo/dojo.js” djconfig=”isDebug: true, parseOnLoad: true”) to:
src=”/dojo/dojo/dojo.js” data-dojo-config=“parseOnLoad: true, isDebug: true“ - Do a global replace from ‘dojoType=’ to:
‘data-dojo-type=’ - For each widget it is necesary to check attributes and move them inside the tag data-dojo-props.
In our form, the date value was set to “value=’2010-08-31′”, the name must be repeated also as I found out thanks to this conversation between Jérôme Despatis and Peter Higgins, and now is:
data-dojo-props=“name:’dtText’, value:’2010-08-31′“.
In the Checkbox and Radio Button the checked state and value are also included. - The events also need modification, as they are evaluated, so in the button the onclick=”getValues()” is now:
data-dojo-props=“onClick:function(){getValues();}“. Notice that the event is now in camelCase form.
This is the final code: Demo_Form_v16.html. [this is a pdf file wich contains the code]
And this is how it runs in Firefox 4.0, Opera 11.10 and Chromium 10.0.648:
Firefox, Opera, Chrome
Interesting IT Tip's 