Collapse all nodes initially Infragistics IgTree

Question

I am using the following Infragistics component for viewing hierarchical data. http://www.igniteui.com/tree/drag-and-drop-single-tree

I have initialized the tree view like below to see all the nodes of the tree expanded initially. Can someone please suggest me if I am missing any option to display all nodes collapsed initially?

 $("#tree").igTree({
                    checkboxMode: "off",
                    singleBranchExpand: true,
                    nodeClick: function (evt, ui) {

                        if (ui.node.data.Folder == "") {
                            var agreements = [];
                            var entry = [];

                            entry.push(ui.node.data.AgreementNbr);
                            entry.push(ui.node.data.ExternalDescription);
                            entry.push(ui.node.data.Description);
                            entry.push(ui.node.data.EffDate);
                            entry.push(ui.node.data.ExpDate);
                            entry.push(ui.node.data.ReleaseStatus);

                            agreements.push(entry);    

                            $('#example').DataTable({
                                responsive: true,
                                columns: [
                                { title: "Agreement Number" },
                                { title: "External Description" },
                                { title: "Description" },
                                { title: "Effective Date." },
                                { title: "Expiry Date" },
                                { title: "Release Status" }
                                ],
                                data: agreements,
                                destroy: true,
                                processing: true,
                            });
                        }
                        else {

                            var output = ui.node.data.Folder.map(function (obj) {

                                var a = [obj.AgreementNbr, obj.ExternalDescription, obj.Description, obj.EffDate, obj.ExpDate, obj.ReleaseStatus];
                                return Object.keys(a).map(function (key) {
                                    return a[key];

                                });
                            });

                            console.log(output);

                            $('#example').DataTable({
                                responsive: true,
                                columns: [
                                { title: "Agreement Number" },
                                { title: "External Description"},
                                { title: "Description"},
                                { title: "Effective Date"},
                                { title: "Expiry Date"},
                                { title: "Release Status"}
                                ],
                                data : output,
                                destroy: true
                            });
                        } 
                    },
                    dataSource: files,
                    dataSourceType: "json",
                    initialExpandDepth: 0,
                    pathSeparator: ".",
                    bindings: {
                        textKey: "Text",
                        valueKey: "Value",
                        imageUrlKey: "ImageUrl",
                        childDataProperty: "Folder",
                        Description: "Description"
                    },
                    // Enable Drag-and-drop feature
                    dragAndDrop: false
                });

Answer 1

Use the initialExpandDepth option

initialExpandDepth : -1

You have that option set to 0.
If you set the initialExpandDepth to -1, all nodes should display collapsed initially.

You can see infragistics.com for more information.