Làm cách nào để nhận id của nút đã chọn trong jsTree?

Question

Làm cách nào để có được id của nút đã chọn trong một jsTree?

function createNewNode() { 
    alert('test'); 
    var tree = $.tree.reference("#basic_html"); 
    selectedNodeId = xxxxxxxxx; //insert instruction to get id here 
    tree.create({ data : "New Node Name" }, selectedNodeId); 
} 

Answer 1

Các nút trong jsTree về cơ bản được bọc các mục danh sách. Điều này sẽ giúp bạn có được một tham chiếu đến cái đầu tiên.

var n = $.tree.focused().get_node('li:eq(0)') 

Bạn có thể thay thế $.tree.focused() nếu bạn có tham chiếu đến cây.

Để có được id, lấy phần tử đầu tiên xuất hiện

if (n.length) 
    id = n[0].id 

hoặc bạn có thể sử dụng chức năng attr jQuery, mà hoạt động trên phần tử đầu tiên trong tập

id = n.attr('id'); 

Answer 2

$.jstree._reference('#my_tree_container')._get_node(null, true).each(function() { 
    id = $(this).attr("id"); 
    alert('Id selected: ' + id);   
    }); 

Answer 3

Không để có được giải pháp của harpo để làm việc, và không muốn sử dụng giải pháp của Olivier vì nó sử dụng các hàm jsTree nội bộ, tôi đã đưa ra một cách tiếp cận khác.

$('#tree').jstree('get_selected').attr('id') 

Thật đơn giản. Hàm get_selected trả về một mảng các mục danh sách được chọn. Nếu bạn làm .attr trên mảng đó, jQuery sẽ xem mục đầu tiên trong danh sách. Nếu bạn cần ID của nhiều lựa chọn, thì hãy coi ID đó là một mảng thay thế.

Answer 4

Với phiên bản mới nhất của Jstree; bạn có thể thực hiện như sau:

<script type="text/javascript> 
    var checked_ids = []; 
    $('#your-tree-id).jstree("get_checked",null,true).each(function(){ 
     checked_ids.push(this.id); 
    }); 
    alert(checked_ids.join(",")); 
</script> 

Answer 5

Tôi gặp sự cố khi nhận id được chọn từ cây có lựa chọn NHIỀU LIỆU. Đây là cách tôi nhận chúng:

var checked_ids = []; 
$("#your-tree-id").jstree('get_selected').each(function(){  
     checked_ids.push($(this).data('id'));       
}); 

Answer 6

Trong trường hợp của tôi, cuộc gọi dữ liệu không hoạt động. Tôi thành công trong việc truy cập dữ liệu nút của mình bằng cách sử dụng hàm attr.

$("#tree").jstree("get_selected").attr("my-data-name"); 

Answer 7

<script type="text/javascript> 
    checked_ids.push($(this).context.id); 
</script> 

Answer 8

Trong jstree phiên bản 3.1.1, bạn có thể lấy nó trực tiếp từ get_selected:

$("#<your tree container's id>").jstree("get_selected") 

Answer 9

Chỉ cần sử dụng

var nodeId = $('#FaqTreeView').jstree().get_selected("id")[0].id; 

nơi #FaqTreeView là id của div của bạn có chứa các jstree.

Answer 10

Trong một số trường hợp và/hoặc phiên bản jstree, giải pháp này không hoạt động.

$('#tree').jstree('get_selected').attr('id'); 

Thay vì xác định "id", tôi không nhận được gì. Bí quyết của tôi là gì:

$("#tree").jstree("get_selected").toString(); 

Answer 11

Trong phiên bản mới nhất của jsTree (kiểm tra tại 3.3.3), bạn có thể thực hiện việc này để nhận một mảng ID:

var ids = $('#tree').jstree('get_selected'); 

Điều này sẽ trở lại, ví dụ: ["selected_id1", "selected_id2", "selected_id3"]. Nếu bạn muốn để có được những lựa chọn nút (không ID), bạn có thể làm điều này:

var nodes = $('#tree').jstree('get_selected', true); 

Các current docs chứa thêm thông tin.

Answer 12

Đây là tất cả các câu trả lời cũ cho các phiên bản cũ. Kể từ phiên bản 3.3.3, thao tác này sẽ hoạt động để nhận tất cả các thuộc tính của nút đã chọn.

$('#jstree').jstree().get_selected(true)[0] 

Nếu sau đó bạn muốn id sau đó thêm .id vào cuối. Bạn có thể xem xét tất cả các thuộc tính khác trong công cụ dành cho nhà phát triển web nếu bạn sao chép mã ở trên.

Answer 13

Bạn có thể sử dụng đoạn mã sau var nút = $ ("# jstree_demo_div") jstree (true) .get_selected ("đầy đủ", true);. // Danh sách các nút chọn

nút [0] .id // Mà sẽ cung cấp id của đối tượng 1 từ mảng

Answer 14

để có được tất cả các id chọn sử dụng mã dưới đây

var selectedData = []; 
var selectedIndexes; 
selectedIndexes = $("#jstree").jstree("get_selected", true); 
jQuery.each(selectedIndexes, function (index, value) { 
    selectedData.push(selectedIndexes[index].id); 
}); 

bây giờ bạn có tất cả các id chọn trong "selectedData" biến