jsTree v.1.0

xml_data plugin

Description

The xml_data plugin enables jsTree to convert XML objects to interactive trees (using XSL). The data (XML) can be set up in the config (as a string) or retrieved from a server (also ondemand).

Two types of XML structures are supported - flat and nested:

<!-- FLAT -->
<root>
	<item id="root_1" parent_id="0" state="closed">
		<content>
			<name><![CDATA[Node 1]]></name>
		</content>
	</item>
	<item id="node_2" parent_id="root_1">
		<content>
			<name><![CDATA[Node 2]]></name>
		</content>
	</item>
</root>

<!-- NESTED -->
<root>
	<item id="xml_1">
		<content><name><![CDATA[Root node 1]]></name></content>
		<item id="xml_2">
			<content><name><![CDATA[Child node 1]]></name></content>
		</item>
	</item>
</root>

Aside from nesting the only difference is the parent_id attribute used in xml_flat.

parent_id defines the parent of the node in XML flat, use 0 for root nodes. Also when using async - use 0 for the first level.

state defines the state of the node (open or closed). You can omit it too - jstree will handle the data automatically - nodes with no children will be leaf nodes, nodes with children will be closed.

All attributes you set on the item node will be transfered to the resulting li node. All attributes you set on the name node will be transfered to the resulting a node.

If you are using the languages plugin you can have multiple name nodes in a every item node, just set a language attribute on each one (<name language="en" ...).

Remember to always set the XML header on your XML files.

Configuration

data

A XML string (or false if not used). Default is false.

Specifies the content to load into the container and convert to a tree.

ajax

An object (or false if not used). Default is false.

The ajax config object is pretty much the same as the jQuery ajax settings object.

You can set the data option to a function, that will be executed in the current tree's scope (this will be the tree instance) and gets the node about to be open as a parameter (or -1 for initial load). Whatever you return in the function will be sent to the server as data (so for example you can send the node's ID).

You can set the url option to a function, that will be executed in the current tree's scope (this will be the tree instance) and gets the node about to be open as a paramater (or -1 for initial load). Whatever you return in the url function will be used as the ajax URL (so that you can accomodate pretty paths such as /get_children/node_2).

The error and success functions (if present) also fire in the context of the tree, and if you return a value in the success function it will be used to populate the tree - this can be useful if you want to somehow change what the server returned on the client side before it is displayed in the tree. Please note that the success function receives a string as the first parameter, and also if you decide to return a value - return a string.

correct_state

A Boolean. Default is true.

If this option is set to true if an AJAX returns an empty result, the node that was about to be opened will be converted to a leaf node (the open icon will no longer be displayed).

clean_node

A Boolean. Default is false.

Set to true if node needs to be cleaned - usually you should leave this to false.

xsl

A string. Default is "flat".

The type of structure you wiil be using - set either to "flat" or "nest".

get_skip_empty

A Boolean. Default is false.

If set to true empty attributes won't be returned by the get_xml function.

NOTE:
If both data and ajax are set the initial tree is rendered from the data string. When opening a closed node (that has no loaded children) an AJAX request is made.

Demos

Using the data config option (flat)

Using the ajax config option (nested)

Using both the data & ajax config options (flat)

API

Both dummy functions - _is_loaded and load_node are overwritten.

.load_node_xml ( node , success_callback , error_callback )

This function is called instead of load_node.

mixed node
This can be a DOM node, jQuery node or selector pointing to an element you want loaded. Use -1 for root nodes.
function success_callback
A function to be executed once the node is loaded successfully - used internally. You should wait for the load_node event.
function error_callback
A function to be executed if the node is not loaded due to an error - used internally. You should wait for the load_node event.

.parse_xml ( data )

This function converts XML strings or objects to the DOM structure required by jstree. Returns a jQuery object.

mixed data
The XML string/object.

.get_xml ( type , node , li_attr , a_attr , is_callback )

This function returns an array of tree nodes converted back to XML.

string type
Either "flat" or "nest". Default is "flat".
mixed node
This can be a DOM node, jQuery node or selector pointing to an element you want returned. Use -1 or omit to get the whole tree.
array li_attr
The attributes to collect from the LI node. Defaults to [ "id" , "class" ]


	
		array a_attr
		The attributes to collect from the A node. Defaults to [ ]

	

	
		string is_callback
		Used internally.