Print Page - Combotree empty folder icon

Trying to figure out how to display a folder tree with only 'folder' icons. no files involved here. The idea is to choose a folder.

The default display shows a file icon for leaf nodes.

I have tried the following workaround, but the folders show up in permanently open state, whether collapsed or not.

loadFilter: function(data, parent){
   function forNodes(data, callback){
   .
   .
   }

   forNodes(data, function(node){
   node.iconCls = 'open-folder';
   });
   return data;

}

The 'open-folder' CSS style must be defined correctly:

Code:

<style type="text/css">
	.open-folder{
		background: url('http://www.jeasyui.com/easyui/themes/default/images/tree_icons.png') no-repeat -224px 0;
	}
</style>

You can use the 'loadFilter' function to custom all the leaf nodes:

Code:

$('#cc').combotree({
	loadFilter: function(data,parent){
		function forNodes(data, callback){
			var nodes = [];
			for(var i=0; i<data.length; i++){
				nodes.push(data[i]);
			}
			while(nodes.length){
				var node = nodes.shift();
				if (callback(node) == false){return;}
				if (node.children){
					for(var i=node.children.length-1; i>=0; i--){
						nodes.unshift(node.children[i]);
					}
				}
			}
		}
		forNodes(data,function(node){
			if (!node.children || !node.children.length){
				node.iconCls = 'open-folder';
			}
		});
		return data;
	}
})

EasyUI Forum

General Category => EasyUI for jQuery => Topic started by: LastByte on October 13, 2015, 06:37:38 PM