Expand all

[tiagorodriguesnes]

Is there any way to start the select fully expanded instead of collapsed?

[omersavas]

Hi m found a solution for expanded all;

select2totree.js
change buildOptions;

`function buildOptions(dataArr, curLevel, pup) {
var labelPath;
if (treeData.labelFld && treeData.labelFld.split('.').length> 1){
labelPath = treeData.labelFld.split('.');
}
var idPath;
if (treeData.valFld && treeData.valFld.split('.').length > 1) {
idPath = treeData.valFld.split('.');
}

		for (var i = 0; i < dataArr.length; i++) {
			var data = dataArr[i] || {};
			var $opt = $("<option></option>");
			$opt.addClass('showme');
			if (labelPath) {
				$opt.text(readPath(data, labelPath));
			} else {
				$opt.text(data[treeData.labelFld || "text"]);
			}
			if (idPath) {
				$opt.val(readPath(data, idPath));
			} else {
				$opt.val(data[treeData.valFld || "id"]);
			}
			if (data[treeData.selFld || "selected"] && String(data[treeData.selFld || "selected"]) === "true") {
				$opt.prop("selected", data[treeData.selFld || "selected"]);
			}
			if($opt.val() === "") {
				$opt.prop("disabled", true);
				$opt.val(getUniqueValue());
			}
			$opt.addClass("l" + curLevel);
			if (pup) $opt.attr("data-pup", pup);
			$el.append($opt);
			var inc = data[treeData.incFld || "inc"];
			if (inc && inc.length > 0) {
				$opt.addClass('opened');
				$opt.addClass("non-leaf");
				buildOptions(inc, curLevel+1, $opt.val());
			}

		} // end 'for'
	}`

[db81]

That will break collapsing nodes (they disappear if you click on them). Here's how to fix that:

diff --git a/select2totree.js b/select2totree.js
index 11dfa0d4c..dc3dbbf96 100644
--- a/select2totree.js
+++ b/select2totree.js
@@ -93,6 +93,8 @@
                        for (var i = 0; i < dataArr.length; i++) {
                                var data = dataArr[i] || {};
                                var $opt = $("<option></option>");
+                               if (treeData['expandAll'] == true)
+                                       $opt.addClass('showme');
                                if (labelPath) {
                                        $opt.text(readPath(data, labelPath));
                                } else {
@@ -116,6 +118,8 @@
                                var inc = data[treeData.incFld || "inc"];
                                if (inc && inc.length > 0) {
                                        $opt.addClass("non-leaf");
+                                       if (treeData['expandAll'] == true)
+                                               $opt.addClass("opened");
                                        buildOptions(inc, curLevel+1, $opt.val());
                                }
                        } // end 'for'

Then just use treeData: { expandAll: true, dataArr: data }.