Dynamic menu with JSON
This feature allows you to download a list of pages you will create to your future website and create a menu from it.
We'll give it a slightly more stylish design later, thanks to the stylish table, but for now it's enough to add a new brick to our CMS. You just need to add a line to the JSON file when creating a new page to complete the menu.
Ajax
This is an Ajax script that has the advantage of being exempt from any server-side programming language. The simple Ajax function allows you to create an XHR object.
JSON file
This file, which is of interest to the dynamic menu, can be automatically created by the application, especially when creating a new article and adding it to the summary.
Menu script
This script is included in the head section of the demo page and called to load using the onload event:
window.onload=loadJSON
It has two functions:
- loadJSON
- It calls the XHR object creation function and loads the file into the responseTxt attribute. Then its contents are entered into the parameter of the buildMenu function called in callback (its name is an argument to the loadJSON function ).
- buildMenu
- It begins by calling the eval () function, which converts this text file into an argument in a JavaScript object.
Then the object passes iteratively (it could be recursive if you wanted to have a submenu).
The vault tag finds the getElementByID DOM function and adds the next menu item to its content, assigning it to the innerHTML attribute.
This script also works well on a local computer without a server.
Display
This demonstration shows the menu defined in the JSON gamic-menu.json file.
This is thanks to the JavaScript menu.js script that is linked in the head section of this page.
This is an Ajax script, it uses the function defined in the ajax.js file.
The demonstration automatically displays the page loading menu.