jstree--AJAX 请求获取数据形成树

概述：

一般情况下都是通过ajax进行请求获取数据。boostrap+ajax

1、代码

//权限分配
		$('#authority').click(function() {
			 $("#jstree").jstree({
		            "core" : {
		                "themes" : {
		                    "responsive": false
		                }, 
		                // so that create works
		                "check_callback" : true,
		                'data' : function (obj, callback) {
		                    var jsonstr="[]";
		                    var jsonarray = eval('('+jsonstr+')');
		                    $.ajax({
		                        type: "GET",
		                        url:"/demo/authority/getAuthoritys",
		                        dataType:"json",
		                        async: false,
		                        success:function(result) {
		                            var arrays= result;
		                            for(var i=0 ; i<arrays.length; i++){
		                            	console.log(arrays[i])
		                                var arr = {
		                                        "id":arrays[i].id,
		                                        "parent":arrays[i].parentId=="root"?"#":arrays[i].parentId,
		                                        "text":arrays[i].name
		                                }
		                                jsonarray.push(arr);
		                            }
		                        }

		                    });
		                    callback.call(this, jsonarray);
		                }
		            },
		            "types" : {
		                "default" : {
		                	"icon" : "glyphicon glyphicon-flash"
		                },
		                "file" : {
		                	 "icon" : "glyphicon glyphicon-ok"  
		                }
		            },
		            "state" : { "key" : "demo2" },
		            "plugins" : [ "dnd", "state", "types","checkbox","wholerow" ]
		        });
				$('#setAuthority').modal();
		});

总结：

1. "responsive": false ：表示主题是否适应手机类小尺寸屏幕，默认为false
2. "check_callback" : true：表示形成树是否可以重新组织，也是改变顺序，层次关系
3. callback.call(this, jsonarray)：将数组放入树形
4. types:{}设置类型，图标
5.  "state" : { "key" : "demo2" }：将选中的状态保存浏览器中
6. "plugins" : [ "dnd", "state", "types","checkbox","wholerow" ] 表示插件相关，详情参考点击打开链接
7. url路径换成你后台地址，返回时json数组

2、html标签

<!-- 权限分配模框-->
	<div class="modal fade" id="setAuthority">
		<div class="modal-dialog">
			<div class="modal-content message_align">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal"
						aria-label="Close">
						<span aria-hidden="true">×</span>
					</button>
					<h4 class="modal-title">权限分配</h4>
				</div>
				<div class="modal-body">
					<div id= "jstree">
					
					</div>
				</div>
				<div class="modal-footer">
					<input type="hidden" id="url" />
					<button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
					<a οnclick="authorityConfirm()"   class="btn btn-success"
						data-dismiss="modal">确定</a>
				</div>
			</div>
			<!-- /.modal-content -->
		</div>
		<!-- /.modal-dialog -->
	</div>