1. 程式人生 > >jquery,ztree,anglarjs使用(一)

jquery,ztree,anglarjs使用(一)

-c ble sco script lec event push clas init

html---------

<span class="filterDIV_sp ">名稱:</span> <div class="filter_inp"> <div class="filter_select_t"> <span >{{queryGalleryTxt}}</span> <div class="filter_i"> <i class="i_orderd" style="margin-top: 10px;"></i> </div> </div> <ul id="queryGallery" class="ztree"></ul> </div> js-------------------- <script src="/angular1.2.28.min.js"></script> <script src="r/angular-cookies1.2.28.js"></script> <script type="text/javascript" src="/jquery-1.10.1.min.js"></script> <script src="/jquery.ztree.all.min.js"></script> ------------------------------- $scope.queryGalleryTxt = "不限"; HikGlobalHTTPService.requestByPost("/Tree",{n:2},function(data,status){ if(status){ var queryGallery = []; recursio(data.result); function recursio(obj){ obj.name = obj.label; obj.pid = obj.id; if(obj.children){ if(obj.children.length > 0){ obj.children = obj.children; obj.open = true; obj.nocheck = false; for(var j = 0; j < obj.children.length; j++){ recursio(obj.children[j]);//遞歸 } } } } queryGallery.push(data.result); sttingQueryGallery = { check: { enable: true, chkStyle: "checkbox", nocheck:false, chkboxType : { "Y": "", "N": "" }//父子節點關聯 }, callback: { onCheck: function(event, treeId, treeNode){ var zTreeArr = zTreeQueryGallery.getCheckedNodes(); var galleryStr = ""; var galleryIdStr = ""; if(zTreeArr.length > 0){ for(var i = 0; i < zTreeArr.length; i++){ if(i < zTreeArr.length - 1){ galleryStr += zTreeArr[i].name + " , "; galleryIdStr += zTreeArr[i].pid + ","; }else{ galleryStr += zTreeArr[i].name; galleryIdStr += zTreeArr[i].pid; } } $scope.queryaisle = galleryIdStr; $scope.queryGalleryTxt = galleryStr; }else{ $scope.queryGalleryTxt = "不限"; $scope.queryaisle = ""; } $scope.$apply(); } } } zTreeQueryGallery = $.fn.zTree.init($("#queryGallery"),sttingQueryGallery,queryGallery) } }) $(".queryGalleryClick").click(function(event){ event.stopPropagation(); $("#queryGallery").show(); $(‘.screen_box‘).css("overflow","visible")
}) $("#queryGallery").click(function(event){ event.stopPropagation(); }) $(document).click(function(){ $("#queryGallery").hide(); })

jquery,ztree,anglarjs使用(一)