Dynamically change MongoDB connection string

Hi everyone,

This is one of the final things I need to work out to complete this project that i’m working on but I can’t figure it out.

The question is concerning my highcharts project. First things first I have a MongoDB collection containing 2 JSON documents:


Although they are the same from the outlook, the data at the final nodes is different.

This data is then working with a Highcharts Large Tree Map. In my application I have a drop down box which contains the categories ‘BILL’, ‘CD’, ‘CONV’ etc etc…


When the user selects one of these choices, the chart is updated to show that part of the data. Although not working, this JSFiddle shows the code how I did this.

Now for the bit i’m struggling with - I want to achieve the same result with the second drop down box (Which you can see in the image). Currently by default the chart is looking to _id:“XAanxJPWrSXybptyJ” but I need this drop down to choose between the two documents. This drop down contains ‘Turnover’ and ‘Concentration’. The value of these drop down boxes will be the _ID of each document so Concentration is:


and Turnover is:


I have another JSFiddle here which shows the code for what I have tried so far but does not update the chart. As you can see from the Fiddle I have pointed the MongoDB string to just render ‘BILL’ but no chart is displayed and I have the error:


So the console log is showing the variable choice as being XAanxJPWrSXybptyJ but this isn’t displaying that document.

I feel like the error is here perhaps the way i’m including [choice] in the MongoDB string:


But I have no idea. If anybody could help I would greatly appreciate it - Apologies for the long winded question just wanted to pack the detail in.

Many thanks,


First thing I notice is that you’re wrapping choice in an array, which would cause findOne to return undefined. You don’t even need to enter a selector with _id just pass the string and the collection will interpret it as the _id like so:


And as a small thing, element.addEventListener('change', callback) is preferred over element.onchange for event listeners

1 Like

Legend! Thanks a million works a treat… Can finally sign this project off :grin:

I’ll take your advice into account and sort out the element.onchange - Thanks for the pointer

Really appreciate your help!!

1 Like