獲取jsTree的檢查值 - 使用表單提交

Question

我使用帶複選框主題的jsTree jQuery插件。有誰知道如何使用表單文章獲取選定的值？

謝謝！

Answer 1

你有答案嗎？如果不是，這裏是一個出現在jstree google groups

 
    function submitMe(){ 
     var checked_ids = []; 
     $("#server_tree").jstree("get_checked",null,true).each 
      (function() { 
       checked_ids.push(this.id); 
      }); 
      doStuff(checked_ids); 

Answer 2

的建議從谷歌集團的解決方案卻沒有對部分檢查工作的節點，在我的情況。我不得不離開get_checked，並執行以下操作以獲得完全選定和部分選定的節點。

 

$(".sector-tree").find(".jstree-undetermined").each(function(i,element){    
    checked_ids.push($(element).attr("id")); 

    if ($(this).find(".jstree-undetermined").length == 0) { 
     $(this).find(".jstree-checked").each(function(i, element){   
      checked_ids.push({$(element).attr("id")); 
     });   
    } 
}); 

// collect the rest of the checked nodes that exist under checked parents 
$(".sector-tree").find(".jstree-checked").each(function(i, element){ //also includes the ones below 'undetermined' parent 

    var selectedElement = $(element).attr("id"); 
    if (hasItem(selectedElement, checked_ids) < 0) {    
     checked_ids.push(selectedElement); 
    } 

}); 

Answer 3

隨着jQuery，你可以簡單地做：

$('.jstree-checked,.jstree-undetermined').each(function(){ 
    var rawCheckedID = $(this).find('a').attr('id'); 
}); 

這將得到不確定的，在同一時間檢查。上面的soumya解決方案可能更有效率。

Answer 4

與Jstree合作的每個人都可能會遇到以下問題：如何在表單提交中獲取Jstree的checked IDs？這裏是解決方案：

function submitMe() { 
    var checked_ids = []; 
    $('#your-tree-id').jstree("get_checked",null,true).each(function(){ 
     checked_ids.push(this.id); 
    }); 
    //setting to hidden field 
    document.getElementById('jsfields').value = checked_ids.join(","); 
} 

現在，我們把它在一個隱藏字段：

<input type="hidden" name="jsfields" id="jsfields" value="" /> 

Answer 5

//click button show nodes checked 
$(document).on('click','#showme',function() { 
    var checked_ids = []; 
    var checked_ids_meta = []; 
    $('#demo_0').jstree("get_checked",null,true).each(function(i, e){ 
     checked_ids.push($(this).data("param")); // json metadata 
     checked_ids_meta.push($(this).attr("href")); // json attr 
    });  
    console.log(checked_ids) 
    console.log(checked_ids_meta)  
}); 

Answer 6

在過去的版本（3.0），該API被改變。

如果你需要選擇的ID只是陣列（像在這個節點的例子），現在是很容易的：

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

如果您需要遍歷選定的元素，你只需要通過額外的「真實」參數。

var selectedElmsIds = []; 
var selectedElms = $('#tree').jstree("get_selected", true); 
$.each(selectedElms, function() { 
    selectedElmsIds.push(this.id); 
}); 

Answer 7

var selectedElmsIds = []; 
 
$("#jstree2").find("li").each(function(i, element) { //also includes the ones below 'undetermined' parent 
 
    if ($(this).attr("aria-selected") == "true") { 
 
    selectedElmsIds.push($(this).attr('id')); 
 
    } 
 
}); 
 
console.log(selectedElmsIds);

Answer 8

這是我沒有：

function getSelectedItems() 
{ 
    var checked_ids = []; 

    checkedNodes = $("#MyTree").jstree("get_checked", null, true); 

    for(var i = 0; i < checkedNodes.length; i++) 
    { 
     var id = $(checkedNodes[i].outerHTML)[0].id; 

     checked_ids.push(id); 
    } 

    // Do whatever you want with the checked_ids 
} 

這會給你的所有選擇的節點及其子節點和葉子的陣列;以及在其他節點下選擇的單個葉子。

Answer 9

$(document).ready(function(){ 
var jsfields = $('#myTree').jstree('get_selected'); 
$('.jsfields').val(JSON.stringify([jsfields])); 
}) 

<input type="hidden" class="jsfields" value=""/> 

變化$('#myTree')到你的價值相應的樹，這是最好的Ajax調用爲我工作。可能需要稍微修改以填充簡單表單的輸入字段。

Answer 10

您可以使用此：

var result = $('#your_tree').jstree('get_selected'); 

https://stackoverflow.com/a/22499278/1883345