To take it further, let us look at other event patterns so we can begin taking measures to refactor our applications to use On Style events. Doing so will make transitioning to Dojo 2.0 easier and help extend the shelf life of an application.
Figure 2 shows events wired up directly in the body of the HTML page, and Figure 3 shows the onClick event assigned inside the header of the application. Both of these examples are old and are not recommended (see: Why is using onClick() in HTML a bad practice?). Developers using these two patterns may incur browser compatibility issues and challenges when implementing AMD patterns.Figure 2
Refactoring the above code with On Style event patterns may look a bit different until you are familiar with the syntax. However, I highly recommend using On Style events as shown in Figure 1.
Now, let us take a quick look at legacy Connect Style events. These are similar to On Style events but were not implemented with Dojo’s AMD pattern for several years. Thus, it is common to see Connect Style event code like Figure 4.Figure 4
var node = dojo.byId("target-id");
var handle = dojo.connect(node, "onclick", myFunction);
Figure 4's approach is also not recommended because Dojo 2.0 will not support the legacy Connect Style of event handling. Even the more modern Connect Style code, which uses the AMD approach, is slated for deprecation. If you want to see what the Connect Style AMD code looks like, review this Dojo Foundation Documentation.
In summary, I highly recommend that developers move to On Style event programming. Reviewing the other event style options in this post will hopefully help developers know what to look for to make upgrading to On Style Events easier.
Doug C. and Noah S. - Support SDK Team