[RESOLVED] jsTree - can I load data from the viewbag?

[FunkyDexter]

Hi All

I'm just trying out the jsTree for the first time and like what I'm seeing. I've got it loading and formatting as I want and have it loading it's data using an ajax query to a method in my controller:-

    <script type="text/javascript">
        $(function () {
            $("#ProductInterests").jstree
                ({
                    "core" : { "themes" : { "icons" : false }},
                    "plugins": ["checkbox"],
                    "core" : 
                        {
                            "data": { 'url': '/Lead/GetProductInterestsJson', 'dataType': 'json' }
                        }

                });

        });
    </script>

The thing is, this is on a view that's being served up from an MVC controller. The controller populates a bunch of Select Lists into the ViewBag which the View then uses to populate various drop downs. It feels natural to populate the tree view in a similar way, i.e. by putting the necessary data into the ViewBag and then using that to populate the data in the View. Somehow having the View call to a method in the controller class just feels a bit odd in this circumstance.

I've had a shufty at the jsTree documentation and a bit of a play with the syntax to see if I can get it to load from the ViewBag but I don't think it's supported. I thought I'd post here, though, to see if anyone knew different.

edit> I should probably specify that this is jsTree3, found here. (I wasted a lot of time trying to get code snippets from previous versions to work before I figured out I was being a numpty)

[FunkyDexter]

Found a way to do it. Quite obvious really. Just add the list to the View Bag and then use razor to loop across the list adding appropriate html elements:-

        <div id="ProductInterests">  
            <ul>
                @foreach (var productGroup in ViewBag.ProductGroups)
                {
                    <li>
                        @productGroup.Name
                    </li>
                }
            </ul>
        </div>