如何动态创建页码并呈现为下拉列表？ [英] How do I dynamically create page numbers and render as dropdown list?

问题描述

我的情况是我需要创建200多个页码，所以我决定在下拉列表中显示页码。



我目前正在使用角度js。



每个页码都会传递参数，这将调用服务器加载表中的另一批数据。



我尝试过：

I have situation that there could be more than 200+ of page numbers i need to create so i decided to show the page numbers in dropdown list.

I am currently using angular js.

Each page number would be passing argument which will make call to server to load another batch of data in the table.

What I have tried:

$http({
        method: "POST",
        url: "Detail.aspx/GetData",
       
        data: JSON.stringify({ dateString: dateValue, pageNumber: pgNum }),
        contentType: "application/json",
        dataType: "json"

    }).then(function (response) {

        var AllObject = JSON.parse(response.data.d);
        $scope.Data = AllObject[0];

        debugger;
        var PageDetail = AllObject[1];
        $scope.pg = PageDetail;
        debugger;
        });


    var numOfPagToDisplay = $scope.pg.numOfPagToDisplay;

  var k =  function(numOfPagToDisplay) {
      var pgNumArray = new (numOfPagToDisplay);
      var c = 1;
      for (var i = 0; i < numOfPagToDisplay; i++) {

          pgNumArray[i] = c;
          c++;
      }
      return pgNumArray;
    }
  $scope.PgNumList = k($scope.pg.numOfPagToDisplay);

HTML代码：

HTML Code:

html is : 

Number Of Data in server : {{::pg.TotalNumber}}
Number Of Records displayed : {{::pg.DisplayedNumberOfRows}}
Number Of Records Remains : {{::pg.NumOfRemaingData}}
Num Of Pages label to create : {{pg.NumOfPageToDisplay}}
Page Numbers: <'select >
<''option ng-repeat="p in PgNumList" value="{{p}}" >{{p}}<'/'option>
<'-select>

<'/p'>

推荐答案

http（{
method： POST，
url：Detail.aspx / GetData，

data：JSON.stringify（{dateString：dateValue，pageNumber：pgNum}），
contentType：application / json，
dataType：json

}）。then（function（response）{

var AllObject = JSON.parse（response.data。 d）;

http({ method: "POST", url: "Detail.aspx/GetData", data: JSON.stringify({ dateString: dateValue, pageNumber: pgNum }), contentType: "application/json", dataType: "json" }).then(function (response) { var AllObject = JSON.parse(response.data.d);

scope.Data = AllObject [0];

debugger;
var PageDetail = AllObject [1];

scope.Data = AllObject[0]; debugger; var PageDetail = AllObject[1];

scope.pg = PageDetail;
debugger;
}）;


var numOfPagToDisplay =

scope.pg = PageDetail; debugger; }); var numOfPagToDisplay =

这篇关于如何动态创建页码并呈现为下拉列表？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！