0

Hello everyone I need to open the tree up to the selected folder only, that is to say without opening the subfolders of the selected directory

For example in the image I do not want to open the file "test3"enter image description here

<script>
$(function () {
    $('#tree')
        .jstree({
            'core' : {
                'data' : {
                    'url' : '<?php echo URL::base(); ?>/tree?operation=get_node',
                    'data' : function (node) {
                        console.log(node.id);
                        return { 'id' : node.id.replace("\/","/") };
                    }
                },
                'check_callback' : function(o, n, p, i, m) {
                    if(m && m.dnd && m.pos !== 'i') { return false; }
                    if(o === "move_node" || o === "copy_node") {
                        if(this.get_node(n).parent === this.get_node(p).id) { return false; }
                    }
                    return true;
                },
                'force_text' : true,
                'themes' : {
                    'responsive' : false,
                    'variant' : 'small',
                    'stripes' : true
                }
            },
            'sort' : function(a, b) {
                return this.get_type(a) === this.get_type(b) ? (this.get_text(a) > this.get_text(b) ? 1 : -1) : (this.get_type(a) >= this.get_type(b) ? 1 : -1);
            },
            'contextmenu' : {
                'items' : function(node) {
                    var tmp = $.jstree.defaults.contextmenu.items();
                    delete tmp.create.action;
                    tmp.create.label = "New";
                    tmp.create.submenu = {
                        "create_folder" : {
                            "separator_after"   : true,
                            "label"             : "Folder",
                            "action"            : function (data) {
                                var inst = $.jstree.reference(data.reference),
                                    obj = inst.get_node(data.reference);
                                inst.create_node(obj, { type : "default" }, "last", function (new_node) {
                                    setTimeout(function () { inst.edit(new_node); },0);
                                });
                            }
                        },
                        "create_file" : {
                            "label"             : "File",
                            "action"            : function (data) {
                                var inst = $.jstree.reference(data.reference),
                                    obj = inst.get_node(data.reference);
                                inst.create_node(obj, { type : "file" }, "last", function (new_node) {
                                    setTimeout(function () { inst.edit(new_node); },0);
                                });
                            }
                        }
                    };

                    if(this.get_type(node) === "file") {
                        delete tmp.create;
                    }
                    return tmp;
                }
            },
            'types' : {
                'default' : { 'icon' : 'folder' },
                'file' : { 'valid_children' : [], 'icon' : 'file' }
            },
            'unique' : {
                'duplicate' : function (name, counter) {
                    return name + ' ' + counter;
                }
            },
            'plugins' : ['state','dnd','sort','types','contextmenu','unique']
        })
        /*********************************/
        .on('open_node.jstree', function (e, data) {
            console.log("sdfsfdsdfs");
        })

        /*********************************/
        .on('delete_node.jstree', function (e, data) {

            $.get('<?php echo URL::base(); ?>/tree?operation=delete_node', { 'id' : data.node.id })
                .fail(function () {
                    data.instance.refresh();
                });
        })
        .on('create_node.jstree', function (e, data) {
            $.get('<?php echo URL::base(); ?>/tree?operation=create_node', { 'type' : data.node.type, 'id' : data.node.parent, 'text' : data.node.text })
                .done(function (d) {
                    data.instance.set_id(data.node, d.id);
                })
                .fail(function () {
                    data.instance.refresh();
                });
        })
        .on('rename_node.jstree', function (e, data) {
            $.get('<?php echo URL::base(); ?>/tree?operation=rename_node', { 'id' : data.node.id, 'text' : data.text })
                .done(function (d) {
                    data.instance.set_id(data.node, d.id);
                })
                .fail(function () {
                    data.instance.refresh();
                });
        })
        .on('move_node.jstree', function (e, data) {
            $.get('<?php echo URL::base(); ?>/tree?operation=move_node', { 'id' : data.node.id, 'parent' : data.parent })
                .done(function (d) {
                    //data.instance.load_node(data.parent);
                    data.instance.refresh();
                })
                .fail(function () {
                    data.instance.refresh();
                });
        })
        .on('copy_node.jstree', function (e, data) {
            $.get('<?php echo URL::base(); ?>/tree?operation=copy_node', { 'id' : data.original.id, 'parent' : data.parent })
                .done(function (d) {
                    //data.instance.load_node(data.parent);
                    data.instance.refresh();
                })
                .fail(function () {
                    data.instance.refresh();
                });
        })

});
</script>
user3609955
  • 29
  • 4
  • Please add the code you have tried so far. – Constantin Groß Feb 10 '17 at 08:07
  • I use the default functions of jstree ".jstree({" - ".on('open_node.jstree', function" - ".on('delete_node.jstree', function"- ".on('copy_node.jstree', function" ... – user3609955 Feb 10 '17 at 08:15
  • Again: Please supply the markup and the script, simplified down to the parts relevant to this question. See http://stackoverflow.com/help/mcve – Constantin Groß Feb 10 '17 at 08:18
  • the script in question thx – user3609955 Feb 10 '17 at 08:31
  • The markup is still missing and your script uses inline PHP output which we'd have to guess what it contains... Also we cannot test ajax requests... – Constantin Groß Feb 10 '17 at 08:32
  • How can I close all subfolders of the selected folder ??? – user3609955 Feb 10 '17 at 08:35
  • how can I close all subfolders of the selected folder – user3609955 Feb 10 '17 at 09:55
  • It won't help if you repeat your question a trillion times here in the comments. I'm not willing to build a test scenario from scratch even before I can try to give you a solution. Maybe someone else will, but if you want help, please provide markup and code with only the parts we need, just like in the help document I linked earlier. In plain English: A working jstree that does not (yet) work in the desired way but where we can see what you tried and just have to make the necessary changes in order to make it work. That can be a jsfiddle, or even better the built-in functionality here on SO. – Constantin Groß Feb 10 '17 at 10:01

1 Answers1

0
<div id="page-content" class="page-content">
<section class="row-fluid">
    <div class="page-header">
        <h3 class="heading-icon" data-icon="&#xe398;" aria-hidden="true"><?php echo __("Arborescence"); ?> <small></small></h3>
    </div>
    <div id="action_directory" style="padding-top: 5px;padding-bottom: 5px;"></div>
    <div style="position:relative">
        <div class="parent-tree span3">
            <div id="tree" class="open"></div>
        </div>
    <a href="javascript:void(0)" class="btn btn-primary btn-tree"><i class="booico-chevron-right"></i></a>
    <div class="parent-visualisation span9" id="files">

    </div>
</section>


<script>
$(document).ready(function($) {

    $('.btn-tree').click(function(){
        $('#tree').toggleClass('open');
        $('.parent-tree').toggleClass('span3');
        $('.parent-visualisation').toggleClass('span9');

    });

    <?php //if($id!=""){?>
        $.ajax({
            url : '<?php echo URL::base(); ?>/file/<?php echo $id;?>?name=<?php echo $name;?>&codification=<?php echo $codification;?>&id_typedocument=<?php echo $id_typedocument;?>',
            dataType : 'html', // On désire recevoir du HTML
            success : function(code_html, statut){
                $("#files").html(code_html);
            }
        });
    $.ajax({
        url : '<?php echo URL::base(); ?>/actiondirectory/<?php echo $id;?>',
        dataType : 'html', // On désire recevoir du HTML
        success : function(code_html, statut){
            $("#action_directory").html(code_html);
        }
    });
    <?php //}?>


});
$(function () {
    $(window).resize(function () {
        var h = Math.max($(window).height() - 0, 420);
        $('#container, #data, #tree, #data .content').height(h).filter('.default').css('lineHeight', h + 'px');
    }).resize();

    $('#tree')
        .jstree({
            'core' : {
                'data' : {
                    'url' : '<?php echo URL::base(); ?>/tree?operation=get_node',
                    'data' : function (node) {
                        return { 'id' : node.id.replace("\/","/") };
                    }
                },
                'check_callback' : function(o, n, p, i, m) {
                    if(m && m.dnd && m.pos !== 'i') { return false; }
                    if(o === "move_node" || o === "copy_node") {
                        if(this.get_node(n).parent === this.get_node(p).id) { return false; }
                    }
                    return true;
                },
                'force_text' : true,
                'themes' : {
                    'responsive' : false,
                    'variant' : 'small',
                    'stripes' : true
                }
            },
            'sort' : function(a, b) {
                return this.get_type(a) === this.get_type(b) ? (this.get_text(a) > this.get_text(b) ? 1 : -1) : (this.get_type(a) >= this.get_type(b) ? 1 : -1);
            },
            'contextmenu' : {
                'items' : function(node) {
                    var tmp = $.jstree.defaults.contextmenu.items();
                    delete tmp.create.action;
                    tmp.create.label = "New";
                    tmp.create.submenu = {
                        "create_folder" : {
                            "separator_after"   : true,
                            "label"             : "Folder",
                            "action"            : function (data) {
                                var inst = $.jstree.reference(data.reference),
                                    obj = inst.get_node(data.reference);
                                inst.create_node(obj, { type : "default" }, "last", function (new_node) {
                                    setTimeout(function () { inst.edit(new_node); },0);
                                });
                            }
                        },
                        "create_file" : {
                            "label"             : "File",
                            "action"            : function (data) {
                                var inst = $.jstree.reference(data.reference),
                                    obj = inst.get_node(data.reference);
                                inst.create_node(obj, { type : "file" }, "last", function (new_node) {
                                    setTimeout(function () { inst.edit(new_node); },0);
                                });
                            }
                        }
                    };

                    if(this.get_type(node) === "file") {
                        delete tmp.create;
                    }
                    return tmp;
                }
            },
            'types' : {
                'default' : { 'icon' : 'folder' },
                'file' : { 'valid_children' : [], 'icon' : 'file' }
            },
            'unique' : {
                'duplicate' : function (name, counter) {
                    return name + ' ' + counter;
                }
            },
            'plugins' : ['state','dnd','sort','types','contextmenu','unique']
        })
        /*********************************/
        .on('open_node.jstree', function (e, data) {

            $(this)[0].tagName;

        })

        /*********************************/
        .on('delete_node.jstree', function (e, data) {

            $.get('<?php echo URL::base(); ?>/tree?operation=delete_node', { 'id' : data.node.id })
                .fail(function () {
                    data.instance.refresh();
                });
        })
        .on('create_node.jstree', function (e, data) {
            $.get('<?php echo URL::base(); ?>/tree?operation=create_node', { 'type' : data.node.type, 'id' : data.node.parent, 'text' : data.node.text })
                .done(function (d) {
                    data.instance.set_id(data.node, d.id);
                })
                .fail(function () {
                    data.instance.refresh();
                });
        })
        .on('rename_node.jstree', function (e, data) {
            $.get('<?php echo URL::base(); ?>/tree?operation=rename_node', { 'id' : data.node.id, 'text' : data.text })
                .done(function (d) {
                    data.instance.set_id(data.node, d.id);
                })
                .fail(function () {
                    data.instance.refresh();
                });
        })
        .on('move_node.jstree', function (e, data) {
            $.get('<?php echo URL::base(); ?>/tree?operation=move_node', { 'id' : data.node.id, 'parent' : data.parent })
                .done(function (d) {
                    //data.instance.load_node(data.parent);
                    data.instance.refresh();
                })
                .fail(function () {
                    data.instance.refresh();
                });
        })
        .on('copy_node.jstree', function (e, data) {
            $.get('<?php echo URL::base(); ?>/tree?operation=copy_node', { 'id' : data.original.id, 'parent' : data.parent })
                .done(function (d) {
                    //data.instance.load_node(data.parent);
                    data.instance.refresh();
                })
                .fail(function () {
                    data.instance.refresh();
                });
        })
        .on('select_node.jstree', function (e, data) {


            if(typeof data.node.original != 'undefined'){
                $.get('<?php echo URL::base(); ?>/file/'+data.node.original.id_directory)
                .done(function (d) {
                    $("#files").html(d);
                    $(".jstree-anchor").children().removeClass("folderselect");
                    $("#"+data.node.a_attr.id).children().addClass("folderselect");
                })
                .fail(function () {
                    data.instance.refresh();
                });
                $.ajax({
                    url : '<?php echo URL::base(); ?>/actiondirectory/'+data.node.original.id_directory,
                    dataType : 'html', // On désire recevoir du HTML,
                    success : function(code_html, statut){
                        $("#action_directory").html(code_html);
                    }
                });

            }


        });
});
</script>
user3609955
  • 29
  • 4