JavaScripting

The definitive source of the best
JavaScript libraries, frameworks, and plugins.


  • ×

    Tree widget for jQuery
    Filed under 

    • 🔾44%Overall
    • 924
    • 5.8 days
    • 🕩174
    • 👥1

    Travis Status Coverage Status

    NPM version

    jqTree

    JqTree is a tree widget. Read more in the documentation.

    screenshot

    Features

    • Create a tree from JSON data
    • Drag and drop
    • Works on ie9+, firefox, chrome and safari
    • Written in Typescript

    The project is hosted on github, has a test suite.

    Examples

    Example with ajax data:

    <div id="tree1" data-url="/example_data/"></div>
    
    $("#tree1").tree();
    

    Example with static data:

    var data = [
        {
            label: "node1",
            id: 1,
            children: [{ label: "child1", id: 2 }, { label: "child2", id: 3 }]
        },
        {
            label: "node2",
            id: 4,
            children: [{ label: "child3", id: 5 }]
        }
    ];
    $("#tree1").tree({
        data: data,
        autoOpen: true,
        dragAndDrop: true
    });
    

    Documentation

    The documentation is on http://mbraak.github.io/jqTree/.

    Thanks

    The code for the mouse widget is heavily inspired by the mouse widget from jquery ui.

    Show All