html:

成都創(chuàng)新互聯(lián)公司-專業(yè)網站定制、快速模板網站建設、高性價比簡陽網站開發(fā)、企業(yè)建站全套包干低至880元,成熟完善的模板庫,直接使用。一站式簡陽網站制作公司更省心,省錢,快速模板網站建設找我們，業(yè)務覆蓋簡陽地區(qū)。費用合理售后完善，10多年實體公司更值得信賴。

<link href="vendors/zTreeStyle/zTreeStyle.css" rel="stylesheet" />

生態(tài)系統(tǒng)類型* ：

 <asp:TextBox ID="TextBox3" CssClass="form-control" runat="server" MaxLength="200" autocomplete="off"></asp:TextBox>

                    <ul class=" dropdown-menu">

                        <li>

                            <ul class="ztree " id="ecosystemType"></ul>

                        </li>

                        <li class="ddl_close"><span>關閉</span></li>

                    </ul>

  <script src="vendors/zTreeStyle/jquery-migrate-1.2.1.js"></script>//ztree 與jquery 版本兼容

    <script src="vendors/zTreeStyle/jquery.ztree.core-3.4.js"></script>

    <script src="vendors/zTreeStyle/jquery.ztree.excheck-3.4.js"></script>

    <script src="vendors/bower_components/angular/angular.min.js"></script>

js:

jQuery(document).ready(function($) {

 //點擊輸入框的 顯示下拉框

    $(".form-control").click(function() {//alert( $(this).find(".ddl_close").html());       

         $(this).next(".dropdown-menu").show()    

         $("body").bind("mousedown", onBodyDown);

    })

    function hideMenu() {

    $(".dropdown-menu").fadeOut("fast");

    $("body").unbind("mousedown", onBodyDown);

//點擊其他位置 關閉下拉

function onBodyDown(event) {

    if (!(event.target.id == "dropdown-menu" || $(event.target).parents(".dropdown-menu").length > 0)) {

        hideMenu();

    }

}

//關閉下來

    $(".ddl_close").click(function() {

        $(this).parent(".dropdown-menu").hide();

        })

})

//-------------angular controller----js------------------------------------------

var app=angular.module('myApp',[]);

app.controller('news_Ctrl',function($scope,$http,$rootScope) {

    //綁定 生態(tài)系統(tǒng)類型

      $scope.setting_ecosystemType={//樹形基本配置

        check: {enable: true,},

        view: {showIcon: false},     

        data: {simpleData: {enable: true}},

        callback: {onCheck: onCheck_ecosystemType}

      };

      function onCheck_ecosystemType(e,treeId,treeNode) {//點擊復選框觸發(fā)事件

        var zTree=$.fn.zTree.getZTreeObj(treeId);

        nodes=zTree.getCheckedNodes(true);

       var v="";

        for(var i=0,l=nodes.length;i<l;i++) {

            if(nodes[i].isParent==false)

           { v+=nodes[i].name+",";}//記錄底層勾選的集樹，不記錄父級

        }

        if(v.length>0) v=v.substring(0,v.length-1); //去掉最后一個分隔符逗號,

        $("#TextBox3").attr("value",v); //賦值到輸入框TextBox3里

    }

    $http({

        method: 'post',

        url: 'WebService/ddltreeWebService.asmx/getDllTree_by_ddlNameEn',  //樹形的數(shù)據地址

        dataType: "json",

        contentType: "application/json",

        data: { ddlNameEn: "ecosystemType" },//

    }).then(function successCallback(response) {

  var data = JSON.parse(response.data.d);//格式化json

        $scope.ecosystemTypeList=data;   //賦值給angular變量  //  console.log($scope.ecosystemTypeList);輸出測試

        for (i = $scope.ecosystemTypeList.length - 1; i >= 0; i--) {

            $scope.ecosystemTypeList[i].open=true;//默認展開樹  

        }

  $.fn.zTree.init($("#ecosystemType"),$scope.setting_ecosystemType,$scope.ecosystemTypeList); //生成樹

    });

 });

標題名稱：(簡)樹形ztree與angularjs結合，實現(xiàn)下級數(shù)據，點擊復選框填寫到輸入框里
網頁地址：http://jinyejixie.com/article46/pgshhg.html

成都網站建設公司_創(chuàng)新互聯(lián)，為您提供電子商務、云服務器、移動網站建設、網站內鏈、微信公眾號、App開發(fā)

廣告

聲明：本網站發(fā)布的內容（圖片、視頻和文字）以用戶投稿、用戶轉載內容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內容未經允許不得轉載，或轉載時需注明來源： 創(chuàng)新互聯(lián)