Time for action — replace simple events with the advanced event model

For a pure academic purpose, we would replace our previously used FC_Rendered simple event with its counterpart in the advanced event model.

1. 1. Create a copy of SimpleEvents.html in the JavaScriptCapabilities folder and name it as AdvancedEvents.html.

2. 2. Open this file in a text editor and replace the entire FC_Rendered function block (line number 17 through 22) with the following lines of code:

   function showChartControls() {
   document.getElementById("chartControls")
   .style.display = "block";
   }
   myChart.addEventListener("rendered", showChartControls);
   

3. 3. Open this file in your browser and you should see that the chart controls' placeholder text shows up in a similar fashion to the earlier simple event model.

What just happened?

Instead of declaring functions with the exact same name as the event name, we created a very straightforward function, showChartControls, which does behave exactly as named! Then we called the addEventListener...