Pro JavaScript for Web Apps pdf - EBook Free Download

CHAPTER 3 ADDING A VIEW MODEL});if (this.type == "submit") {$('form').submit();} else if (this.type == "reset") {mapProducts(function(item) {item.quantity(0);})}});// ...code removed for brevity... //I have shown only part of the script in the listing because the changes are quite minor. Notice how Iam able to use jQuery and plain JavaScript to manipulate the view model. I don’t need to add any codefor the basket placeholder, since it will be managed by KO. In fact, all I need do is widen the jQueryselection so that I create jQuery UI button widgets for both the submit and reset input elements and adda click handler function. In the function I submit the form or change the quantity values to zerodepending on which button the user clicks. You can see the placeholder for the basket in Figure 3-7.Figure 3-7. Using a placeholder when the basket is emptyYou will have to load the examples in a browser if you want to see how the buttons work. The easiestway to do this is to use the source code download that accompanies this book and that is availablewithout charge at Apress.com.SummaryIn this chapter, I showed you how to embrace the kind of design philosophy that you may havepreviously used in desktop or server-side development, or at least as much of that philosophy as makessense for your project.By adding a view model to my web app, I was able to create a much more dynamic version of theexample application; it’s one that is more scalable, easier to test and maintain, and makes changes andenhancement a breeze.You may have noticed that the shape of a structured web application changes so that there is a lotmore code relative to the amount of HTML markup. This is a good thing, because it puts the complexity74www.it-ebooks.info