This workshop is for you, if:
- You would like to know how Jquery and JSON work together
- You are trying to create series of dependent dropdowns based on data present in client side
A brief introduction of the two technologies used in this workshop are given below.
We would like to create a series of dropdown for our website. The first dropdown will provide a list of sections (i.e. Java Programming and Market Analysis). On selecting, it should display another dropdown with list of categories (like Java Basics, JSP & Servlets etc). On selecting the category, it should display a bullet list of articles under this selection. We do not want our page to get refreshed on each select. However, for this example, we assume that we maintain the data in a static file in the client side instead fetching data from server side.
We identify and describe each element necessary for implementing the above mentioned requirement.
As per the requirement, we would like to store the data in a static file. We generally have three options viz. Properties file, XML file and JSON file. Since we need to handle everything from client side using Jquery, JSON would be the best bet.
We maintain two different json files.
- site_category.json – Maintains data related to sections and categories
- site_articles.json – Maintains the data related to categories and articles
- Next >>