jQuery Bonsai - Super lightweight jQuery tree plugin

jQuery bonsai is a lightweight jQuery plugin that takes a big nested list and prunes it down to a small expandable tree control.

Also includes support for checkboxes (including 'indeterminate' state) and for populating the tree using a JSON data source.

• denizli escort
• denizli escort
• didim escort
• düzce escort
• edirne escort
• edirne escort
• edremit escort

Source: aexmachina.github.io

1. INCLUDE CSS AND JS FILES

<link rel='stylesheet' type='text/css' href='https://github.jspm.io/aexmachina/jquery-bonsai@master/jquery.bonsai.css' />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src='bower_components/jquery-bonsai/jquery.bonsai.js'></script>

2. HTML

<ol id='auto-checkboxes' data-name='foo'>
  <li class='expanded' data-value='0'>All
    <ol>
      <li data-value='1'>One</li>
      <li data-value='2'>
        Two
        <ol>
          <li data-name='baz' data-value='3'>
            Three
            <ol>
              <li data-name='baz' data-value='4' data-checked='1'>Four</li>
            </ol>
          </li>
          <li data-value='5'>Five</li>
        </ol>
      </li>
    </ol>
  </li>
</ol>

3. JAVASCRIPT

$('#auto-checkboxes').bonsai({
  expandAll: true,
  checkboxes: true, // depends on jquery.qubit plugin
  createCheckboxes: true // takes values from data-name and data-value, and data-name is inherited
});

More information at: http://aexmachina.github.io/jquery-bonsai/