Jstree權(quán)限勾選選中

實現(xiàn)后臺管理端樹形權(quán)限勾選,沒有使用默認勾選策略,默認勾選策略不是很人性化,自己通過事件實現(xiàn)策略,還是不是很完美。

QQ圖片20170512154543.png

插件代碼

$('#jstree1').jstree({
            'core': {
                'data': ${treeJson},
                'expand_selected_onload' : false
            },
            "checkbox" : {
                "keep_selected_style" : false,
                'three_state' : false,
                'tie_selection' : false
            },
            "plugins" : [ "checkbox" ]
        }).bind('loaded.jstree', function(event, jstree) {
            var $jstree = $('#jstree1').jstree(true);
            var data = jstree.instance._model.data;
            var firstSubKey;

            // 根據(jù)json參數(shù)勾選默認
            for(key in data) {
                if('#' === key) {
                    continue;
                }
                if(data[key].li_attr._checked) {
                    $jstree.check_node(key);
                }
                if(!firstSubKey && $jstree.get_node(key).parents.length == 1) {
                    firstSubKey = key;
                }
            }
            // 默認打開一級展示
            if(firstSubKey) {
                $jstree.close_all();
                $jstree.open_node(firstSubKey);
            }
        }).bind('open_node.jstree', function(event, jstree) {
            // 打開當前級關(guān)閉其它級展示
            var $jstree = $('#jstree1').jstree(true);
            var data = jstree.instance._model.data;
            var cur_node = jstree.node;
            for(key in data) {
                if(key !== cur_node.id && !isInArray(cur_node.parents, key)) {
                    $jstree.close_node(key);
                }
            }
        }).bind('check_node.jstree', function(event, jstree) {
            var $jstree = $('#jstree1').jstree(true);
            var data = jstree.instance._model.data;
            var cur_node = jstree.node;
            if(!$jstree.is_open(cur_node.id)) {
                $jstree.open_node(cur_node.id);
            }
            // 選中及所有父級
            $jstree.check_node(cur_node.parents);
        }).bind('uncheck_node.jstree', function(event, jstree) {
            // 取消其所有子級
            var $jstree = $('#jstree1').jstree(true);
            var data = jstree.instance._model.data;
            var cur_node = jstree.node;

            for(key in data) {
                var node = $jstree.get_node(key);
                if(cur_node.id === node.parent) {
                    $jstree.uncheck_node(key);
                }
            }
        });

獲取選中id

var ids = [];
var $jstree = $('#jstree1').jstree(true);
var data = $jstree._model.data;
 for(key in data) {
      if($jstree.is_checked(key)) {
            ids.push(data[key].li_attr._id);
       }
 }
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

推薦閱讀更多精彩內(nèi)容

  • Spring Cloud為開發(fā)人員提供了快速構(gòu)建分布式系統(tǒng)中一些常見模式的工具(例如配置管理,服務(wù)發(fā)現(xiàn),斷路器,智...
    卡卡羅2017閱讀 134,973評論 19 139
  • Android 自定義View的各種姿勢1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 173,446評論 25 708
  • 你體驗過殘疾人的生活嗎? 大二打球時不小心將腳踝扭傷,由于病情嚴重,我過了兩個月拄拐的生活。那個階段讓我結(jié)結(jié)實實地...
    新生大學(xué)閱讀 285評論 0 1
  • 廣州夜里,走去吃完飯的路上。看見幾個印象深刻的畫面。一個匆匆忙忙急于闖紅綠燈的大衣女人,還是因為車流湍急,退回去斑...
    YolandaLIUsh閱讀 252評論 0 0
  • 這幾天各大網(wǎng)絡(luò)媒體都拿佟麗婭陳思誠離婚的消息刷屏了。和以往不同,對這樁未曾落實的離婚消息,大家都口徑一致的發(fā)表一邊...
    知畫秋嬋閱讀 392評論 0 4