真实的国产乱ⅩXXX66竹夫人,五月香六月婷婷激情综合,亚洲日本VA一区二区三区,亚洲精品一区二区三区麻豆

成都創(chuàng)新互聯(lián)網(wǎng)站制作重慶分公司

angularjs中popup-table彈出框表格指令的示例分析-創(chuàng)新互聯(lián)

小編給大家分享一下angularjs中popup-table彈出框表格指令的示例分析，相信大部分人都還不怎么了解，因此分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后大有收獲，下面讓我們一起去了解一下吧！

創(chuàng)新互聯(lián)是一家集網(wǎng)站建設,陽江企業(yè)網(wǎng)站建設,陽江品牌網(wǎng)站建設,網(wǎng)站定制,陽江網(wǎng)站建設報價,網(wǎng)絡營銷,網(wǎng)絡優(yōu)化,陽江網(wǎng)站推廣為一體的創(chuàng)新建站企業(yè)，幫助傳統(tǒng)企業(yè)提升企業(yè)形象加強企業(yè)競爭力。可充分滿足這一群體相比中小企業(yè)更為豐富、高端、多元的互聯(lián)網(wǎng)需求。同時我們時刻保持專業(yè)、時尚、前沿，時刻以成就客戶成長自我，堅持不斷學習、思考、沉淀、凈化自己，讓我們?yōu)楦嗟钠髽I(yè)打造出實用型網(wǎng)站。

具體如下：

//表格處理 
app.directive('popupTable', ['$http', '$rootScope', '$cookies', '$location', function ($http, $rootScope, $cookies, $location) { 
  return { 
    restrict: 'E', 
    templateUrl: 'popuptable_templete.html', 
    scope: { 
      url: '=', 
      routepath: '=?', 
      routetype: '=?', 
      onCallback: '&', 
      mulitselect: '=', 
      selectnode: '=?' 
    }, 
    link: function ($scope, element, attrs) { 
      $scope.myValue = false; 
      $scope.checkallvalue = false; 
 
      var primaryKeyFieldName = ""; 
      var codeFieldName = ""; 
      $scope.showAddButton = true; 
      $scope.showRefreshButton = true; 
      var checkList = new Array(); 
 
      //監(jiān)視url變化。從而重新讀取數(shù)據(jù) 
      $scope.$watch('url', function (newVal, oldVal) { 
        if (oldVal != newVal) { 
          //設定全選為false 
          $scope.checkallvalue = false; 
          querySearch(0, ""); 
        } 
      }); 
 
      //選擇所有 
      $scope.checkall = function () { 
        if (angular.isDefined($scope.popupdata) && $scope.popupdata.length > 0) { 
          angular.forEach($scope.popupdata, function (item, index) { 
            $scope.changeChoose($scope.checkallvalue, item); 
          }); 
        } 
      } 
 
      //選擇改變時事件 
      $scope.changeChoose = function (check, data) { 
        var index = findSelected(data); 
        if (check) { 
          if (index <= -1) 
            checkList.push(data); 
        } else { 
          if (index > -1) 
            checkList.splice(index, 1); 
        } 
      } 
 
      //通過data數(shù)據(jù)在數(shù)組中查詢,并返回所在的索引，沒有找到則返回-1 
      function findSelected(data) { 
        var indexvalue = -1; 
        if (angular.isUndefined(checkList) || checkList.length <= 0 || primaryKeyFieldName == "") 
          return indexvalue; 
        angular.forEach(checkList, function (item, index) { 
          if (indexvalue == -1) { 
            if (item[primaryKeyFieldName] == data[primaryKeyFieldName]) { 
              indexvalue = index; 
            } 
          } 
        }); 
        return indexvalue; 
      } 
 
      //判斷是否選中 
      $scope.isChecked = function (rowdata) { 
        return findSelected(rowdata) > -1; 
      } 
 
      //1、讀取網(wǎng)絡數(shù)據(jù)，分頁，搜索  
      function querySearch(index, searchText) { 
        if ($scope.popupdata != null && $scope.popupdata.length > 0) 
          $scope.popupdata = null; 
        //初始化 
        var params = { "SearchKey": searchText, "UserId": $rootScope.loginUserId }; 
        params = angular.extend(params, { "IsGetColumns": index > 0 ? false : true }); 
 
        //刷新或者查詢的時候需要清空已選擇項 
        if (index > 0) 
          checkList.splice(0, checkList.length); 
 
        $scope.loading = true; 
        $(".no-data-div").hide(); 
 
        serverRequestwithformdata($http, $rootScope.SystemUrl + $scope.url + "/PopupList", $.param(params), function (data) { 
          console.info(data); 
          $scope.loading = false; 
          if (data.status == "ok") { 
            if (index <= 0) { 
              $scope.title = data.windowTitle; 
              $scope.columnlist = data.colums; 
              $scope.showAddButton = data.ShowAdd; 
              $scope.showRefreshButton = data.ShowRefresh; 
              primaryKeyFieldName = data.primayKey; 
              codeFieldName = data.codeField; 
              //url 變化導致執(zhí)行=>處理已勾選項=>賦值勾選項。 
              if (checkList.length > 0) 
                checkList.splice(0, checkList.length); 
              if (angular.isDefined($scope.selectnode) && $scope.selectnode != null && $scope.selectnode.length > 0) 
                checkList = $scope.selectnode; 
            } 
            $scope.data = data.records; 
            var sum = data.records.length; 
            $(".sum").text("共" + sum + "條數(shù)據(jù)");  
            $scope.pages = Math.ceil(sum / $rootScope.PageSize); 
            $scope.newPages = $scope.pages > 5 ? 5 : $scope.pages; 
            $scope.pageList = []; 
            $scope.selPage = 1; 
            $scope.sumPage = Math.ceil($scope.data.length / $rootScope.PageSize); 
            for (var i = 0; i < $scope.newPages; i++) { 
              $scope.pageList.push(i + 1); 
            } 
            if (sum == 0) { 
              $(".no-data-div").show(); 
              $(".no-data-span").val("無數(shù)據(jù)"); 
            } 
            $scope.setData(); 
            $(".pages").text("當前第" + $scope.selPage + "頁" + "/" + "共" + $scope.sumPage + "頁"); 
          } else { 
            $(".no-data-div").show(); 
            $(".no-data-span").val(data.message); 
          } 
        }, function (data) { 
          $scope.loading = false; 
          $(".no-data-div").show(); 
          $(".no-data-span").val("訪問錯誤"); 
        }); 
      } 
 
      //設置表格數(shù)據(jù)源(分頁) 
      $scope.setData = function () { 
        //通過當前頁數(shù)篩選出表格當前顯示數(shù)據(jù) 
        $scope.popupdata = $scope.data.slice(($rootScope.PageSize * ($scope.selPage - 1)), ($scope.selPage * $rootScope.PageSize)); 
        if (angular.isDefined($scope.popupdata) && $scope.popupdata.length > 0) { 
          var indexvalue = 0; 
          angular.forEach($scope.popupdata, function (item, index) { 
            if (findSelected(item) > -1) 
              indexvalue++; 
          }); 
          $scope.checkallvalue = (indexvalue == $scope.popupdata.length); 
        } 
      } 
 
      //打印當前選中頁索引 
      $scope.selectPage = function (page) { 
        if (page < 1 || page > $scope.pages) 
          return; 
        if (page > 2) { 
          var newpageList = []; 
          for (var i = (page - 3) ; i < ((page + 2) > $scope.pages ? $scope.pages : (page + 2)) ; i++) { 
            newpageList.push(i + 1); 
          } 
          $scope.pageList = newpageList; 
        } 
        $scope.selPage = page; 
        $scope.setData(); 
        $scope.isActivePage(page); 
        $(".pages").text("當前第" + page + "頁" + "/" + "共" + $scope.sumPage + "頁"); 
      }; 
 
      //跳轉(zhuǎn) 
      $scope.jump = function () { 
        var page = parseInt($(".jump-bar").val()); 
        if ($(".jump-bar").val() == 0) { 
          swal("請輸入跳轉(zhuǎn)頁數(shù)", "", "error"); 
          return; 
        } 
        //不能小于1大于大 
        if (page < 1 || page > $scope.pages) return; 
        //最多顯示分頁數(shù)5 
        if (page > 2) { 
          //因為只顯示5個頁數(shù)，大于2頁開始分頁轉(zhuǎn)換 
          var newpageList = []; 
          for (var i = (page - 3) ; i < ((page + 2) > $scope.pages ? $scope.pages : (page + 2)) ; i++) { 
            newpageList.push(i + 1); 
          } 
          $scope.pageList = newpageList; 
        } 
        $scope.selPage = page; 
        $scope.setData(); 
        $scope.isActivePage(page); 
        $(".pages").text("當前第" + page + "頁" + "/" + "共" + $scope.sumPage + "頁"); 
      }; 
 
      //設置當前選中頁樣式 
      $scope.isActivePage = function (page) { 
        return $scope.selPage == page; 
      }; 
 
      //上一頁 
      $scope.Previous = function () { 
        $scope.selectPage($scope.selPage - 1); 
      } 
 
      //下一頁 
      $scope.Next = function () { 
        $scope.selectPage($scope.selPage + 1); 
      }; 
 
      //關閉彈出框 
      function closewindow() { 
        $(".pop-up").stop(true, false).fadeOut(); 
      } 
 
      //取消彈出框 
      $scope.PopupCancel = function () { 
        closewindow(); 
      } 
 
      //確定 
      $scope.PopupOK = function () { 
        if (primaryKeyFieldName == "" || codeFieldName == "") { 
          swal("當前未配置返回信息", "", "error"); 
          return; 
        } 
        //獲取選中的數(shù)據(jù),并關閉彈出，然后返回填值  
        if (angular.isUndefined(checkList) || checkList.length <= 0) { 
          swal("請勾選要操作的數(shù)據(jù)", "", "error"); 
          return; 
        } 
        var allowMulti = false; 
        if (angular.isDefined($scope.mulitselect)) { 
          allowMulti = $scope.mulitselect; 
        } 
        var primaryKey = ""; 
        var codeKey = ""; 
        //只存在1個的情況 
        if (checkList.length == 1) { 
          primaryKey = checkList[0][primaryKeyFieldName]; 
          codeKey = checkList[0][codeFieldName]; 
        } else { 
          //存在多個 
          if (allowMulti == false) { 
            primaryKey = checkList[0][primaryKeyFieldName]; 
            codeKey = checkList[0][codeFieldName]; 
          } else { 
            angular.forEach(checkList, function (item, index) { 
              primaryKey += item[primaryKeyFieldName] + ","; 
              codeKey += item[codeFieldName] + ","; 
            }); 
          } 
        } 
        if (primaryKey.endsWith(",")) 
          primaryKey = primaryKey.substring(0, primaryKey.length - 1); 
        if (codeKey.endsWith(",")) 
          codeKey = codeKey.substring(0, codeKey.length - 1); 
        closewindow(); 
        if ($scope.onCallback) { 
          $scope.onCallback({ data: checkList, primaryKey: primaryKey, codeKey: codeKey, url: $scope.url }); 
        } 
      } 
 
      //刷新 
      $scope.PopupRefresh = function () { 
        $("#searchText").val(""); 
        querySearch(1, ""); 
      } 
 
      //新增 
      $scope.PopupAdd = function () { 
        $location.path('/' + $scope.routepath).search({ id: '-1', type: $scope.routetype }); 
      } 
 
      //搜索 
      $scope.PopupSearch = function () { 
        querySearch(1, $("#searchText").val()); 
      } 
    } 
  }; 
}]);

模板的url 頁面

 
  $(function () { 
    //全選 
    $(".Pagingjump-check").click(function () { 
      if (this.checked) { 
        $(this).parents().parents().parents(".tDefault").find(".table-checked").each(function () { 
          this.checked = true; 
        }) 
      } 
      if (!this.checked) { 
        $(this).parents().parents().parents(".tDefault").find(".table-checked").each(function () { 
          this.checked = false; 
        }) 
      } 
    }); 
  }) 
 
 
  {{title}}
                                              查詢                            
    
                        0" >                                                  序號            {{column.DisplayColumnName}}                                                        {{ $index + 1 }}            {{data[column.ColumnName]}}                                    無數(shù)據(jù)        
                              
                                                                                                                                                                                                                                共0條數(shù)據(jù)            當前第1頁/共1頁                                                                                                                          新增                                                                                                        刷新                                                                    確定                                                                    取消                                                       

調(diào)用：

//打開彈出框 
    $scope.openpop = function (type) { 
      $(".pop-up").stop(true, false).fadeIn(); 
      //根據(jù)綁定值進行讀取操作 
      if (type == "SearchHistory") { 
        //請求數(shù)據(jù)即可.讀取List接口 
 
      } else { 
        //讀取PopupList接口         
        $scope.routetype = "ReturnPopup"; 
        if (type == "process") 
          $scope.routepath = "ProcessDetail"; 
        else if (type == "productmodel") 
          $scope.routepath = "ProductModelDetail"; 
        var temp = $cookies.get(type + "checkcache"); 
        if (angular.isDefined(temp) && temp != null) 
          $scope.selectnode = jQuery.parseJSON(temp); 
        $scope.urlpart = type; 
      } 
    } 
 
    $scope.popupcallback = function (data, primaryKey, codeKey, url) { 
      //根據(jù)url存儲data 
      if (data != null & data.length > 0) 
        $cookies.put(url + "checkcache", JSON.stringify(data)); 
      if (url == "process") { 
        $scope.selectprocessNametip = codeKey; 
        $scope.selectprocessIdtip = primaryKey;          
      } 
      else if (url == "productmodel") { 
        $scope.selectproductNametip = codeKey; 
        $scope.selectproductIdtip = primaryKey; 
      } 
    }
 
   
     
  

以上是“angularjs中popup-table彈出框表格指令的示例分析”這篇文章的所有內(nèi)容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內(nèi)容對大家有所幫助，如果還想學習更多知識，歡迎關注創(chuàng)新互聯(lián)成都網(wǎng)站設計公司行業(yè)資訊頻道！

另外有需要云服務器可以了解下創(chuàng)新互聯(lián)scvps.cn，海內(nèi)外云服務器15元起步，三天無理由+7*72小時售后在線，公司持有idc許可證，提供“云服務器、裸金屬服務器、高防服務器、香港服務器、美國服務器、虛擬主機、免備案服務器”等云主機租用服務以及企業(yè)上云的綜合解決方案，具有“安全穩(wěn)定、簡單易用、服務可用性高、性價比高”等特點與優(yōu)勢，專為企業(yè)上云打造定制，能夠滿足用戶豐富、多元化的應用場景需求。


文章題目：angularjs中popup-table彈出框表格指令的示例分析-創(chuàng)新互聯(lián)
文章源于：http://weahome.cn/article/dchosi.html

在線咨詢

微信咨詢

電話咨詢

028-86922220（工作日）

18980820575（7×24）

提交需求

返回頂部