JavaScript Decision Tree tool

My goal has been to make a JavaScript Decision Tree tool as a new content module for our next site redesign.

It needs to work such that the same piece of JavaScript can be utilised without modification for any decision tree tool we build on the site, with a very simply-defined markup structure,

So I’ve been self-administering repeated doses of headdesk/facepalm over the last couple of days, but I came back today after a Friday lunch (you know what I mean) and found a solution. It’s not pretty, with at least two nested ‘for’ loops, but it works.

I’ve created a JSFiddle of it, so you can take a look at it, modify it, laugh at it, etc.
Open it in JSFiddle or see it embedded below:

This entry was posted in Coding, JavaScript. Bookmark the permalink.

11 Responses to JavaScript Decision Tree tool

  1. JP says:

    js fiddle . . . sounds dodgy . . .

  2. Adam Bright says:

    Awesome job.

    I did add something for my purposes, because the nodes were getting long, FYI.

                for (i = 0; i < options.length; i += 1) {
                    options_buffer += options[i];
                    $('fieldset.option' + options_buffer).removeClass('hide');				
    				document.getElementById('question' + options_buffer.replace(/(.)/g, '_$1')).scrollIntoView(); //***NEW Scroll to the latest option.***

  3. Dan says:

    Nice touch! Cheers!

  4. Johanus says:

    I found a small bug/limitation, whatever you would like to call it. If you add 10+ radio buttons in my example 11, 12 were showing up twice because the same class names were being used/generated for options 1, 2 for another step were they both automatically worked out to ‘option211’ and ‘option212’. But otherwise a pretty nice script.

  5. Nina says:

    I pay a quick visit daily some blogs and sites to read articles or reviews, but this web site gives
    feature based posts.

    Here is my webpage :: online guitar lessons

  6. Christal says:

    Why visitors still usse to read news papers when inn this technological world
    eveeything is presented on net?

  7. I believe that is among the most significant info for me.
    And i’m happy studying your article. However should commentary on some general things, The web site taste is wonderful, the articles is in point of fact nice
    : D. Excellent task, cheers

  8. For a simpler way to build and manage decision trees, with a robust set of tools, I’m using Zingtree.

    Rather than editing code, even non-programmers can easily manage and build trees. There’s a visual designer tool, and also a forms based wizard that makes this process easy. You can also embed trees into your web site with 4 lines of code.

    It’s at

  9. Monserrate says:

    FXOpen: resumed CHF trading.

  10. Bradly says:

    Please let me know if you’re looking ffor a articlle author
    forr your weblog. You have some really gpod posts and I feel I would be
    a good asset. If you evfer want tto take some of the load off, I’d really like
    tto wrte some materiazl for your blog in excfhange for a link back to mine.

    Please blkast me an e-mail if interested. Thank you!

  11. Robert says:

    Great beat ! I wish tto apprentice while you amend yokur
    website, how can i subscrijbe for a blog website? The accfount helped mee a acceptable deal.
    I had been a little bit acquainted of this
    your broadcast offered bright clear idea

Leave a Reply

Your email address will not be published. Required fields are marked *