обертывание текста листа в jstree

Я использую jstree плагин, чтобы населить мое дерево на основе xml файла. Некоторый текст узлов больше, чем контейнерное отделение. Там какой-либо путь к jstree текстам узла обертки текста?

$(document).ready(function(){
     $("#tree").jstree({  
         "xml_data" : {  

             "ajax" : {  

                 "url" : "jstree.xml" 

             },  

             "xsl" : "nest"


         },  
         "themes" : {  

             "theme" : "classic",  

            "dots" : true,  

             "icons" : true 

         },  

        "search" : {  

                 "case_insensitive" : true,  

                 "ajax" : {  

                     "url" : "jstree.xml" 

                 }  

             },  
              "plugins" : ["themes", "xml_data", "ui","types", "search"] 


    }).bind("select_node.jstree", function (event, data) {

        $("#tree").jstree("toggle_node", data.rslt.obj);
14
nl ja de

4 ответы

Это работало на 3.0.8

.jstree-anchor {
    /*enable wrapping*/
    white-space : normal !important;
    /*ensure lower nodes move down*/
    height : auto !important;
    /*offset icon width*/
    padding-right : 24px;
}

И для тех, которые используют wholerow плагин;

//make sure the highlight is the same height as the node text
$('#tree').bind('hover_node.jstree', function() {
    var bar = $(this).find('.jstree-wholerow-hovered');
    bar.css('height',
        bar.parent().children('a.jstree-anchor').height() + 'px');
});

Для 3.1.1, и для него, чтобы также работать с select_node.jstree используют эту функцию вместо этого:

function(e, data) {
    var element = $('#' + data.node.id);
    element
        .children('.jstree-wholerow')
        .css('height', element.children('a').height() + 'px')
    ;
}
12
добавлено
wholerow вставной наконечник был тем, что я искал.
добавлено автор SNag, источник
Большой ответ! Это работало на меня, но на деревья, которые предварительно выбрали данные, это didn' t. Я использовал следующее:
$ (#tree') .bind ' open_node.jstree'->
бар = $ (этот) .find (' .jstree wholerow clicked\U 0026\\U 0023\39;)
bar.css ' height' bar.parent() .children (' a.jstree anchor\U 0026\\U 0023\39;) .height() + ' px'
добавлено автор TwiceB, источник

Попытайтесь добавить следующий стиль к детским якорям вашего jsTree отделения:

#jstree_div_id a {
    white-space: normal !important;
    height: auto;
    padding: 1px 2px;
}

У меня также есть макс. ширина на моем jsTree моделировании отделения:

#jstree_div_id
{
    max-width: 200px;
}
10
добавлено
Большое спасибо! Это работает отлично на меня!
добавлено автор Tung, источник
Спасибо Это - работа, превосходная для меня
добавлено автор MR Kesavan, источник
#tree_id {
  .jstree-anchor {
    white-space: normal;
    height: auto;
  }
  .jstree-default .jstree-anchor {
    height: auto;
  }
}
1
добавлено

Я нашел ответ по совпадению, и это работало на меня, но, у меня было другое правило css, которое препятствовало тому, чтобы код функционировал хорошо

Я удалил правило CSS (минута-height:200px) "в моем коде", и следующий ответ работал на меня, как я ожидал.

#tree_div_id a {
white-space: normal;
height: auto;
padding: 0.5ex 1ex;
margint-top:1ex;
}
0
добавлено