Creating the Pattern

Usually when you read about the MVC pattern, it is not related to JavaScript. However, as I am sure you have noticed, we have already begun to implement this pattern with the components we have built. Each of the components consists of at least one controller and one view object, whereas the model consists of the objects that interact with the server, such as the Ajax, AjaxUpdater, and HTTP objects that we created in Part II, "Creating and Using the JavaScript Engine." Creating this pattern is as simple as starting with the folder structure in the code folder of our application. Since this pattern is related to the JavaScript code we are creating, we will create this structure within the javascript directory as in Figure 15.2.

Figure 15.2. Directory structure for the MVC pattern.

This is obviously trivial and might seem like a waste of time to cover, but it is the basis for the structure we will utilize when creating objects we would like to fit into this pattern. Let's take the Accordion component from Chapter 10, "Accordion," as an example. This component is composed of two objects: Accordion and Panel. Figure 15.3 shows the previous MVC structure with the Accordion component and associated model objects.

Figure 15.3. MVC directory structure with the Accordion component.

The Accordion object is the controller for this component because it interacts with another controller (AjaxUpdater) and ultimately the model (Ajax), and responds to the panel with the information from the server. The Panel object represents the view and presents to the user the different panels the accordion is composed of. When a user interacts with a panel, the panel interacts with the AjaxUpdater. This controller then sends a request to the model, which is our Ajax object. Therefore, we end up with multiple MVC triads working together to accomplish a task. Take a look at Figure 15.4 for a graphic view of how the data flows between the objects in this pattern.

Figure 15.4. Graphical view of how the Accordion uses the MVC pattern.

This is a good example of how the pattern can fluctuate. You can use multiple objects from different aspects of the MVC structure to work together as one whole unit, yet keep those objects completely decoupled.

Ajax for Web Application Developers
Ajax for Web Application Developers
ISBN: 0672329123
EAN: 2147483647
Year: 2007
Pages: 129
Authors: Kris Hadlock

Similar book on Amazon © 2008-2017.
If you may any questions please contact us: