jstree 相關

jstree搜索置頂方法--代碼以下：

if(to) { clearTimeout(to); }
   			to = setTimeout(function () {
   				var v = $('#dict_queryinput').val();
   				var searchResult = $("#dict_treeDiv").jstree('search', v);
   				var searchResultList = $(searchResult).find('.jstree-search');
   				var searchResultListLen = searchResultList.length;
   				if(searchResultListLen > 0){
   					$(searchResultList[0]).focus();
   				}else {
   					$(searchResult).find('.jstree-search').focus();
   				};
   			}, 250);
複製代碼

查詢 篩選 上下選中

樹節點採用click 觸發，是爲了觸發響應的表格詳情，若是不須要觸發詳情，可使用focus

$('#dict_queryinput').keyup(function () {
   			if(to) { clearTimeout(to); }
   			to = setTimeout(function () {
   				var v = $('#dict_queryinput').val();
   				searchResult = $("#dict_treeDiv").jstree('search', v);
   				searchResultList = $(searchResult).find('.jstree-search');
   				searchResultListLen = searchResultList.length;
   				$.each($(searchResult).find('.jstree-anchor'),function(index,ele){
					$(ele).removeClass("jstree-add-focused");
				});
   				if(searchResultListLen > 1){
   					$("#dict_queryinput").attr("href","#"+$(searchResultList[0]).attr("id"))
   					$('#dict_queryinput').click();
   					$(searchResultList[0]).addClass("jstree-add-focused");
   					$(searchResultList[0]).click();
   					Dictionary.queryInputNext(searchResultList);
   					Dictionary.queryInputPrev(searchResultList);
   				}else {
   					$("#dict_queryinput").attr("href","#"+$(searchResultList[0]).attr("id"))
   					$('#dict_queryinput').click();
   					$(searchResultList[0]).addClass("jstree-add-focused");
   					$(searchResult).find('.jstree-search').click();
   				};
   			}, 250);
   		});
複製代碼

點擊下一個

Dictionary.queryInputNext = function(_searchResultList){
		var thisLen = _searchResultList.length;
		$("#dict_queryinput_next").off("click").on("click",function(){
			$.each(_searchResultList,function(index,ele){
					if($(ele).hasClass("jstree-add-focused")){
						if(thisLen-index > 1){
							$(ele).removeClass("jstree-add-focused");
							$("#dict_queryinput").attr("href","#"+$(_searchResultList[index+1]).attr("id"))
		   					$('#dict_queryinput').click();
							$(_searchResultList[index+1]).addClass("jstree-add-focused");
							$(_searchResultList[index+1]).click();
						}else{
							alert("這是查詢到的最後一條");
							$(_searchResultList[index]).focus();
							return false;
						}
						return false;
					}
			});
		});
	}
複製代碼

點擊上一個

Dictionary.queryInputPrev = function(_searchResultList){
		var thisLen = _searchResultList.length;
		$("#dict_queryinput_prev").off("click").on("click",function(){
			$.each(_searchResultList,function(index,ele){
				if($(ele).hasClass("jstree-add-focused")){
					if(thisLen-index == thisLen){
						alert("這是查詢到的最後一條");
						$(_searchResultList[0]).focus();
						return false;
					}else{
						$(ele).removeClass("jstree-add-focused");
						$("#dict_queryinput").attr("href","#"+$(_searchResultList[index-1]).attr("id"))
	   					$('#dict_queryinput').click();
						$(_searchResultList[index-1]).addClass("jstree-add-focused");
						$(_searchResultList[index-1]).click();
					}
					return false;
				}
		});
		});
	}
複製代碼

搜索後篩選搜索結果

注意初始化時「search」和「types」的位置

$("#jstreeId").jstree({
	    'core' : {
	        'data' : newModelTree,
	        'force_text' : true,
		    'check_callback' : true,
			'themes' : {
				"theme" : "default",
				"dots" : false
			}
	    },
		"search": {
		                "show_only_matches": true, //filtering
		                "show_only_matches_children": true

		            },
		            "types": {
		                "types": {
		                    "disabled": {
		                        "check_node": false,
		                        "uncheck_node": false
		                    }
		                }
		            },
					'plugins' : [ 'themes' , 'state','dnd','contextmenu','wholerow','search']
	    		}).on('search.jstree', function (nodes, str, res) {
	                if (str.nodes.length === 0) {
	                	$("#jstreeId").hide();
	                }
	            });
複製代碼

var to = false;
var searchResult;
var searchResultList;
var searchResultListLen;
$('#queryinput').keyup(function () {
	if(to) { clearTimeout(to); }
	to = setTimeout(function () {
		$("#jstreeId").show();
		var v = $('#queryinput').val();
		 $("#jstreeId").jstree('search', v);
	}, 250);
});
複製代碼

that.$ciTree.on("changed.jstree", function (e, data) {
		   			if (!data.node) {
		   				return;
		   			}
		   		    //給當前元素添加jstree-add-focused 類名，方便下面點擊按鈕實現
		   			if($("#"+data.node.id+">a").hasClass("jstree-search")){
		   				$(".queryinput-button").show();
		   				$("#"+data.node.id).parents(".jstree-container-ul").find(".jstree-add-focused").removeClass("jstree-add-focused");
			   			$("#"+data.node.id+">a").addClass("jstree-add-focused");
		   			}else{
		   				$(".queryinput-button").hide();
		   			}
		   			
					that.selectBmModleName = data.node.id;
					//that.reloadTable(); // 點擊數操做時的code
		   	  });
複製代碼