Have you seen the cool text input boxes on the Twitter homepage recently (make sure you are logged out). Twitter is using CSS transitions to achieve the effect but unfortunately those are still not fully adopted just yet. I created (with a bit of cleanup help from kgf on #dojo @ irc.freenode.net) a similar effect with Dojo and made a dojo.query() “plugin” out of it which does work in most browsers:
I’ve had many ask me about any workshops for developers who work with Dojo. When I direct them at SitePen, they always respond with, but those are geared towards companies—aren’t there any public workshops? Aside from telling them to read the documentation and getting involved online, I’ve had to reply with a solemn “no”. That has all changed as SitePen has announced that they are going to start an offering of public workshops.
They are going to offer two of them in San Jose for a first round, we’ll see what happens after that. They’re $2500 a pop but it sounds like they will be covering a lot of great content!
Dojo provides the ability for developers to create Java-like classes with the powerful dojo.declare(). It does this by allowing you to easily create namespaced classes that support multiple inheritance (which are basically mixins). Provided in this functionality is the ability to call:
… from within any of your methods in a class that extends another and have it call the super class instance of that method in the same way you would call super() in a Java class to call the super class’ method.
This past week I was on a couple of new classes, one super class and another class that extends that super class. I called this.inherited() within my constructor of the class to call the super constructor. I was noticing something strange in Firebug though—my super class’ constructor was getting called twice even though I was only calling it once. I reproduced this in JSFiddle as you can see below:
To summarize, only use this.inherited() within non-constructor methods in your classes. I recall running into this issue once before so I thought I blog about it for my own personal reference and for that of others.
Since we’ve completely committed to using the Dojo Toolkit at work, there have been more questions raised about various aspects of the toolkit. One of the more popular ones that I am asked and that I see asked often online is what is the difference between dojo.byId() and dijit.byId()?.
Dojo.byId() is simply a replacement for the native document.getElementById(). Dijit.byId() on the other hand is a utility method that you use to get a reference to an instance of a dijit widget on the page. This means that you won’t be getting a reference to a DOM node like you do with dojo.byId() but rather an instance of a dijit widget class along with access to all of its methods and properties.
As a programmer, you should try to think of how you can write your code in a way that is maintainable and loosely coupled from other parts of your application. Loosely coupled basically means that you don’t tie down functionality and modules to be dependent on other parts of your application. In a way, you want to try and categorize the functionality and keep the functionality in one spot. Take our modern day telephone system for example. If you wanted to use your phone at home to call your friend on their phone on the other side of the world, the phones themselves don’t have to know each other. All they are concerned about is how to interact directly with the telephone system. The telephone system simply requires a telephone to know how to dial out and to be able to receive a phone call when the line is being rung.
Thanks to a reader for reaching out to me and pointing out that the source code is not posted on the Friends of ED site or this site for the book. I sincerely apologize for this inconvenience and mishap. For now, until it is posted on the publisher’s site, I have provided a link below that will allow you to download all the source code zipped up.
Note, there is no source code in Chapter 3 and therefore you will not see a “ch03″ folder in the zip file that you download.
Update: Here is the code for Chapter 6 which contains animationEvents.html - Download .zip
Submitting an Ajax form using Dojo is very straightforward and simple. The main goal here is to simply send the values of a form to a backend script (whatever your preference, e.g. PHP or Python), without ever leaving the page. The page should also show a response to the user confirming that their request was sent successfully.
For starters, we need a simple HTML form that we are going to send. Construct this as you normally would with an id, action, and method values. In my example, I’ve created a basic contact form: