Advanced User Interface Controls and Components

IntegralUI Web

Documentation and API Reference

insertItemAt(item, index, parent)

Inserts a new item at specified position in TreeView widget.


itemObjectThe item to insert to the tree collection
indexIntegerThe indexed location within the collection to insert the item
parent (optional)ObjectThe item which will represent the parent of the newly added item

Return Value

This method does not return a value.

Version Information

Supported in: v1.0.


In this example we are showing how to use insertItemAt method to insert a new item as a child at position 2 to a currently selected item. Although the position is set to 2, if selected item doesn't have any child items, the new item will be added as a first child of selected item.

$(document).ready(function() {

// Create an instance of TreeView widget

var $tree = $('#treeview').treeview();


var getItemCount = function(){

return $tree.treeview("getList").length + 1;



var createNewItem = function(){

return { text: "Item" + getItemCount() };



$tree.treeview("insertItemAt", createNewItem(), 2);


<!DOCTYPE html>



<link rel="stylesheet" href="css/integralui.treeview.css" />

<link rel="stylesheet" href="css/themes/theme-blue.css" />

<script type="text/javascript" src="external/jquery-1.9.1.min.js"></script>

<script type="text/javascript" src="external/jquery.ui.core.min.js"></script>

<script type="text/javascript" src="external/jquery.ui.widget.min.js"></script>

<script type="text/javascript" src="js/jquery.integralui.widget.min.js"></script>

<script type="text/javascript" src="js/jquery.integralui.treeview.min.js"></script>



<div id="treeview" class="widget"></div>





width: 300px;

height: 300px;



See Also