Table of Contents
In this chapter, we show how to build a front-end web application with enumeration attributes, using plain JavaScript. In addition to the topic of enumeration attributes, we also show how to deal with multi-valued attributes because in many cases, enumeration attributes are multi-valued.
Compared to the Validation App discussed in Chapter 8, we now deal with the following new issues:
We replace the ES5 constructor-based class definition of our
model class Book with a corresponding ES6
class definition.
Instead of defining explicit setters we now make use of the
ES5 feature of defining implicit get/set
methods for properties.
Enumeration datatypes have to be defined in a suitable way as part of the model code.
Enumeration attributes have to be defined in model classes and handled in the user interface with the help of suitable choice widgets.
In terms of coding, the new issues are:
In the model code we now have to take care of
defining an ES6 class (instead of a constructor function) for
Book;
defining get/set methods for
all properties of the Book class
definition;
defining the enumerations with the help
of a utility (meta-)class Enumeration, which is
discussed below;
defining the single-valued enumeration
attributes originalLanguage
and category together with their check functions
checkOriginalLanguage and
checkCategory;
defining the multi-valued
enumeration attributes
otherAvailableLanguages and publicationForms together with their
checks checkOtherAvailableLanguages and
checkPublicationForms;
extending the methods Book.update, and
Book.prototype.toString such that they take care
of the added enumeration attributes.
In the user interface ("view") code we have to take care of
adding new table columns in
retrieveAndListAllBooks.html and suitable choice
widgets in createBook.html and
upateBook.html;
creating output for the new attributes in the
setupUserInterface() method of
pl.v.retrieveAndListAllBooks;
allowing input for the new attributes in the
setupUserInterface() methods of
pl.v.createBook and
pl.v.updateBook.