# How to trigger update to chart based on dropdown selection

**URL:** <https://forum.freecodecamp.org/t/how-to-trigger-update-to-chart-based-on-dropdown-selection/326067>\
**Category:** General\
**Created:** [November 10, 2019, 4:40pm UTC](https://forum.freecodecamp.org/t/how-to-trigger-update-to-chart-based-on-dropdown-selection/326067 "2019-11-10T16:40:30Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![sabbyiqbal](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/sabbyiqbal/32/104864_2.png) [@sabbyiqbal](https://forum.freecodecamp.org/u/sabbyiqbal)\
**Post date:** [November 10, 2019, 4:40pm UTC](https://forum.freecodecamp.org/t/how-to-trigger-update-to-chart-based-on-dropdown-selection/326067/1 "2019-11-10T16:40:31Z")

</div>

Hi - I have a data dashboard that shows several indicators depending on what the user selected in the dropdown.

Code: [https://github.com/SabahatPK/RoundTwo](https://github.com/SabahatPK/RoundTwo)  
This is how I expect the code to work - mostly all found in `main.js`:  
1 - Load pages with default graphs (b/c genderFlag is false).  
2 - User selects other option from dropdown; genderFlag gets reset to True.  
3 - Page should switch from default graphs to new set of graphs.

I need something to trigger a rerun of the code that invokes the constructor function, `StackedArea`.

I’m no React expert but I recognize that the question I am asking is very similar to the problems that React was designed to solve.

The problem is that I don’t want to use React (b/c I am using d3 and do not want to make my life more complicated (yet) by trying to learn how to integrate the 2 libraries).

Any help would be much appreciated - thank you!

---

<div class="post-metadata">

**Author:** ![skaparate](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/skaparate/32/125896_2.png) [@skaparate](https://forum.freecodecamp.org/u/skaparate)\
**Post date:** [November 10, 2019, 5:08pm UTC](https://forum.freecodecamp.org/t/how-to-trigger-update-to-chart-based-on-dropdown-selection/326067/2 "2019-11-10T17:08:51Z")

</div>

Hello!

The simplest answer would be to surround the code that builds the chart with a function that gets called when the `select` changes. For example:

```javascript
function createChart() {
  // Clean the chart/svg
  // Build the chart
}

document.querySelector('.my-select').onchange = createChart;

```

---

<div class="post-metadata">

**Author:** ![ILM](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/ilm/32/363239_2.png) [@ILM](https://forum.freecodecamp.org/u/ILM)\
**Post date:** [January 16, 2021, 2:45pm UTC](https://forum.freecodecamp.org/t/how-to-trigger-update-to-chart-based-on-dropdown-selection/326067/3 "2021-01-16T14:45:59Z")

</div>

Closed on January 16, 2021, 2:45pm UTC