Question

i know there is a plugin for jsTree named jquery.tree.checkbox.js. that make the tree node multi checkable.

i just wondered if there is a plugin to raido check the tree node? or how can i modify jquery.tree.checkbox.js to achieve that?

Answer 1

This can simply be done by adding the attribute

    rules:{
            multiple : false
          }

Inside the configuration of the tree. This will make it impossible to choose multiple entries.

Answer 2

@Asaf s answer seems to no longer work on version 3.3.1 in 2016. You now need to set multiple on core:

$jstree.jstree({
    core: {
        multiple: false,
        ...
    }
});

Answer 3

Setting multiple:false will still allow cascading so you need to turn that off too.

version 3.3.3

$(".tree").jstree({
    plugins: ["checkbox"],
    core: {
        data: ...,
        multiple: false
    },
    checkbox: {
        three_state: false,
        cascade: "none"
    }
});

Answer 4

The radio button option is still not released, so you have to change the chceckbox option as single select.

bind( check_node.jstree , function(e, data) {
    var currentNode = data.rslt.obj.attr("id");
    $("#tree").jstree("get_checked",null,true).each 
        (function () { 
            if(currentNode != this.id){
                jQuery.jstree._reference($("#tree")).uncheck_node( # +this.id);
            }
        }); 
});

refer this http://jsfiddle.net/bwTrP/1/

Answer 5

Using jsTree version 3.2.1 with the checkbox plugin it is possible to emulate radiobutton behaviour handling the changed event as follows:

//jstree configuration:
 checkbox : {
    three_state: false, //required for the cascade none to work
    cascade:  none  //no auto all_children<->parent selection
},
//...

var resetting = false;
$( #tree ).on( changed.jstree , function (e, data) {
    if (resetting) //ignoring the changed event
    {
        resetting = false;
        return;
    }
    if ($("#multiselect").is( :checked ) == false && data.selected.length > 1) {
        resetting = true; //ignore next changed event
        data.instance.uncheck_all(); //will invoke the changed event once
        data.instance.check_node(data.node/*currently selected node*/);
    }
});

JSFiddle: JSTree radiobutton behaviour example using checkbox plugin

友情链接