В jstree как да поставите определен възел във фокус върху голямо дърво?

Имам голяма jstree структура за внедряване на таксономичен мениджър. Нямам проблем с отварянето на конкретен възел по id: treeElement.jstree('open_node', nodeId);

Написах поле за търсене и когато избера елемент от падащото меню за търсене, се отваря поле за редактиране за този елемент. Въпреки това дървото, което продължава да се вижда надолу в левия панел, не се фокусира върху този елемент. Мога да отворя избрания възел, но той може да е извън екрана, тъй като може да е в различна част от дървото от текущо видимата селекция (всичко е в голяма област за превъртане).

Моят въпрос: Как мога да направя така, че дървото да се фокусира върху желания възел? Потребителят трябва действително да види къде в дървото се намира избраният от него възел. Не искам да се налага да превъртам нагоре или надолу, за да го намеря. Това изглежда доста стандартно, но не мога да намеря отговор никъде. Благодаря!


focus tree visible jstree
person riketscience    schedule 10.04.2015    source източник

Отговори (3)


arrow_upward
10
arrow_downward

Използвайте функцията get_node с параметър asDom, зададен на true, и след това фокусирайте, така:

treeElement.jstree(true).get_node(nodeId, true).children('.jstree-anchor').focus();

Имайте предвид, че възелът трябва да е видим (в DOM), за да работи това.

Ако възелът не се вижда (един от неговите родители е затворен), можете да използвате вътрешната функция _open_to, за да го разкриете (и можете също да го фокусирате тук, за да бъде просто):

treeElement.jstree(true)._open_to(nodeId).focus();

С най-добри пожелания Иван

person vakata    schedule 17.04.2015

arrow_upward
2
arrow_downward

Разбирам, че когато изберете възел от падащото меню, искате всъщност да го видите също. Опитвали ли сте да използвате jQuery .focus()?

$( "#dropdown-item" ).click(function() {
  $( "#nodeId" ).focus();
});
person Harry    schedule 13.04.2015

arrow_upward
0
arrow_downward

1- в ядрото на jstree трябва да се добави ("анимация": 0)

"core": {
    "initially_open": ["phtml_1"],
    "rtl": true,
    "animation": 0
},

2- Изберете възел:

var str1 ='mynodeid';
$("#demo1").jstree('select_node', "#" + str1 );

Функция 3-in bind Select_node:

.bind("select_node.jstree", function (event, data) {
    data.inst._fix_scroll(data.rslt.obj);
}
person H.P    schedule 17.07.2015