jsTree v.1.0 - Search documentation

# jsTree v.1.0

# search plugin

## Description

The `search` plugin enables searching for nodes whose title contains a given string, works on async trees too. All found nodes get the `jstree-search` class applied to their contained `a` nodes - you can use that class to style search results.

## Configuration

### search_method

A string. Default is `"contains"`.

The method to use for searching. The other options bundled with jstree are `"jstree_contains"` (case insensitive search) and `"jstree_title_contains"` (case insensitive based on the title tag of the A node). For multiple word search take a look this: https://github.com/vakata/jstree/issues/10 - you can easily write your own method too.

### show_only_matches

A boolean. Default is `false`.

If set to `true` all non-matching nodes are hidden and only the matching nodes (and their parents) are left visible, until the search is cleared. Keep in mind `show_only_matches` is heavy on the browser/DOM and is still experimental.

### ajax

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

This object can be used to make a request to the server on each search - useful if you are using async trees. That way you can return an array of IDs that need to be loaded before the actual DOM search is performed (so that all the nodes that will match the search are loaded). For example if the user searches for "string", you get that on the server side, check the database and find out that there is a node containing that string. But the node is the child of some other node, etc - so in your response you must return the path to the node (without the node itself) as ids: `["#root_node","#child_node_3"]`. This means that jstree will load those two nodes before doing the client side search, ensuring that your node will be visible.

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 search string as a paramater. Whatever you return in the function will be sent to the server as data.

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 search string as a paramater. Whatever you return in the function will be used as the URL of the ajax request.

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 as the array of IDs.

## Demos

### Searching nodes

Do not open the node - instead - just press the button.

### Using adv_search

Try pressing the buttons. It will also work with AJAX searching.

- Root node 1
  - Child node 1
  - Child node 2
  - ADV_SEARCH
  - Child node 4
- Root node 2

## API

### .search ( str , skip_async )

Searches for nodes matching the supplied string. Triggers an event.

- `string` str

  The string to search for.

- `boolean` skip_async

  If set to `true` - skip the async search (if setup in the config). This is used mostly internally.

### .clear_search ( )

Clears the current search. This function is automatically called when doing a new search. Triggers an event.

### ._search_open ( is_callback )

Used internally if async is setup in the config. This functions loads the nodes returned by the server one by one.