bootstrap-treeview 前台使用

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%
	response.setHeader("Pragma", "No-cache");
	response.setHeader("Cache-Control", "no-cache");
	response.setHeader("Expires", "0");
	String path = request.getContextPath();
%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
 <link href="css/bootstrap.min.css" rel="stylesheet">
	<link rel="stylesheet" type="text/css" href="<%=path%>/js/bootstrap/css/bootstrap.min.css" />
	<script type="text/javascript" src="<%=path%>/js/bootstrap/js/bootstrap.min.js"></script>
	<script type="text/javascript" src="<%=path%>/js/bootstrap/js/bootstrap-treeview.min.js"></script>
    <script type="text/javascript">    
    	$(function(){ 
    		function init(tree){
                var $checkableTree = $('#treeview-checkable').treeview({
                data: tree,
                showIcon: false,
                showCheckbox: true,
                showTags:true,
                bootstrap2: false,
                levels:5,
                onNodeChecked: function(event, node) {
                  $('#checkable-output').prepend('<p>' + node.text + ' was checked</p>');
                },
                onNodeUnchecked: function (event, node) {
                  $('#checkable-output').prepend('<p>' + node.text + ' was unchecked</p>');
                }
              });

              var findCheckableNodess = function() {
                return $checkableTree.treeview('search', [ $('#input-check-node').val(), { ignoreCase: false, exactMatch: false } ]);
              };
              var checkableNodes = findCheckableNodess();

              // Check/uncheck/toggle nodes
              $('#input-check-node').on('keyup', function (e) {
                checkableNodes = findCheckableNodess();
                $('.check-node').prop('disabled', !(checkableNodes.length >= 1));
              });

              $('#btn-check-node.check-node').on('click', function (e) {
                $checkableTree.treeview('checkNode', [ checkableNodes, { silent: $('#chk-check-silent').is(':checked') }]);
              });

              $('#btn-uncheck-node.check-node').on('click', function (e) {
                $checkableTree.treeview('uncheckNode', [ checkableNodes, { silent: $('#chk-check-silent').is(':checked') }]);
              });

              $('#btn-toggle-checked.check-node').on('click', function (e) {
                $checkableTree.treeview('toggleNodeChecked', [ checkableNodes, { silent: $('#chk-check-silent').is(':checked') }]);
              });

              // Check/uncheck all
              $('#btn-check-all').on('click', function (e) {
                $checkableTree.treeview('checkAll', { silent: $('#chk-check-silent').is(':checked') });
              });

              $('#btn-uncheck-all').on('click', function (e) {
                $checkableTree.treeview('uncheckAll', { silent: $('#chk-check-silent').is(':checked') });
              });
    		}

	       	var tree; 
			$.ajax({
	        	  type:'post',
	        	  url:'/init.do',
	        	  success:function(data){
			     init(data);			      
	        	  }
	           });
	    
    });  
    
    function submit(){
		var arr = new Array();
		var $tree = $('#treeview-checkable');
		arr = $tree.treeview('getChecked', 0);
		var fristArr = new Array();
		var secondArr = new Array();
		var thirdArr = new Array();
		var fourthArr = new Array();
		if(arr.length==0){
			alert("请选择节点");
			return;
		}
<span style="white-space:pre">		</span>//获取节点所在的层次
		for(var i=0 ; i< arr.length;i++){
			var node = arr[i];
			var temp = $('#treeview-checkable').treeview('getNode', node.nodeId);
			var href = node.href;
			if(href.indexOf("root")>-1){
				var v=2;
				continue;
			}else{
				if(node.parentId == 0){
					fristArr.push(href);
				}else{
					if (($tree.treeview('getNode', node.parentId)).parentId == 0) {
						secondArr.push(href);
					} else if($tree.treeview('getNode', ($tree.treeview('getNode', node.parentId)).parentId).parentId == 0) {
						thirdArr.push(href);
					}else{
						fourthArr.push(href);
					}
				}				
			}
		}
		$.ajax({
			type:'post',
			traditional :true, 
			url:'gdupWeb/runtask.do',
			data:{firstSpecIDs:fristArr,secondSpecIDs:secondArr,thirdSpecIDs:thirdArr,fourthSpecIDs:fourthArr,startdate:startdate,enddate:enddate},
			success:function(data){
				if (data=="1") {

				}
			}
		});
    }
    
    </script>
</head>
<body>
	<div id="treeview-checkable" class=""></div>
</div>
</body>
</html>

  • 3
    点赞
  • 9
    收藏
    觉得还不错? 一键收藏
  • 3
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值