jsTree checkbox plugin 사용 노트

1864 단어
  • 트리로 사용할 용기를 앞부분에 div를 놓으세요.
  • jstree를 참조합니다.min.js와 스타일.min.css
  • 페이지에서 초기화
  • 
        $(function () {
            var $checkbox_tree = $("#checkbox_tree");
            $checkbox_tree.jstree({
                core: {
                    animation: false,
                    'data': {
                        'url': function (node) {
                            //   url  node_id
                            return base_url + folder + controller + '/tree/' + node.id;
                        },
                        'data': function (node) {
                            return {
                                //       
                                'readonly': true,
                                "tree_id": $("#id").val()
                            };
                        }
                    }
                },
                //       
                checkbox: {
                    tie_selection: false,
                    whole_node: false
                },
                plugins: ["checkbox", "wholerow"]
            });
    
            //    ,    
            $checkbox_tree.bind("loaded.jstree", function (e, data) {
                $checkbox_tree.jstree('open_all');
            });
        });
    
    
  • 백그라운드에서 데이터를 제공하는 방법
  • public function tree($node_id = null)
    {
        $tree_id= $this->input->get('tree_id');
        $tree= $this->tree_model->get($tree_id, $node_id);
    
        foreach ($tree as $node) {
            $n['type'] = $node->type;
            if ($node->has_child)
                $n['children'] = true;
            if ($node->checked) {
                $n['state'] = array("checked" => true);
            }
            if ($this->input->get('readonly')) {
                $n['state']['checkbox_disabled'] = true;
            }
            $result[] = $n;
        }
        $this->json($result);
    }
    

    좋은 웹페이지 즐겨찾기