You are browsing the old site - check the new version out

back to the documentation homepage

jsTree v.1.0

crrm plugin

Description

The CRRM plugin handles creating, renaming, removing and moving nodes by the user.

Configuration

input_width_limit

A number. Default is 200.

When renaming (or creating) nodes the input for the text will autosize - this number sets the maximum size for the input.

move

An object, containing various settings - see below for more.

move.always_copy

true, false or "multitree". Default is false.

Defines how moves are handled - if set to true every move will be forced to a copy (leaving the original node in place). If set to "multitree" only moves between trees will be forced to a copy.

move.open_onmove

A Boolean. Default is true.

If set to true, when moving a node to a new, closed parent, the parent node will be opened when the move completes.

move.default_position

A string or a number. Default is "last".

The default position to move to if no position is specified. This can be a zero based index to position the element at a specific point among the new parent's current children. You can also use one of these strings: "before", "after", "inside", "first", "last".

move.check_move

A function. Default is function (m) { return true; }.

The callback function enabling you to prevent some moves - just return false. The m parameter is the move object generated by jstree. The object follows the structure described in ._get_move.

Demos

Creating nodes

Removing nodes

Renaming nodes

Moving nodes

move_1 uses the default position - "first"

move_2 specifies a position - "before" - meaning that the node specified as a first argument will come above the node specified as the second argument

move_3 will never work, because of the specified check_move function which prevents the first root node from being moved

API

._show_input ( node , callback )

Renders an input field in a node. Used only internally.

.rename ( node )

Sets a node in rename mode and when the user has entered changes, an event is triggered.

  • mixed node

    This can be a DOM node, jQuery node or selector pointing to an element within the tree. If you use the UI plugin - pass null to use the currently selected item.

.create ( node , position , js , callback , skip_rename )

Creates a new node. Triggers an event.

  • mixed node

    This can be a DOM node, jQuery node or selector pointing to the element you want to create in (or next to). If you use the UI plugin - pass null to use the currently selected item.

  • mixed position

    The position of the newly created node. This can be a zero based index to position the element at a specific point among the current children. You can also pass in one of those strings: "before", "after", "inside", "first", "last".

  • object js

    The data for the newly created node. Consists of three keys:

    attr - an object of attributes (same used for jQuery.attr(). You can omit this key;
    state - a string - either "open" or "closed", for a leaf node - omit this key;
    data - a string or an object - if a string is passed it is used for the title of the node, if an object is passed there are two keys you can specify: attr and title;

  • function callback

    A function to be executed once the node is created. You'd be better off waiting for the event.

  • bool skip_rename

    Skips the user input step. The node is created with the data you have supplied.

.remove ( node )

Removes a node. Triggers an event.

  • mixed node

    This can be a DOM node, jQuery node or selector pointing to an element within the tree. If you use the UI plugin - pass null to use the currently selected items.

 

.check_move ( ), .move_node ( )

Both functions are overwritten from the core in order to implement the new functionality.

.cut ( node )

Cuts a node (prepares it for pasting).

  • mixed node

    This can be a DOM node, jQuery node or selector pointing to an element within the tree. If you use the UI plugin - pass null to use the currently selected item.

.copy ( node )

Copies a node (prepares it for pasting).

  • mixed node

    This can be a DOM node, jQuery node or selector pointing to an element within the tree. If you use the UI plugin - pass null to use the currently selected item.

.paste ( node )

Pastes copied or cut nodes inside a node.

  • mixed node

    This can be a DOM node, jQuery node or selector pointing to an element within the tree. If you use the UI plugin - pass null to use the currently selected item.