0

我想在我的项目中添加简单的分页程序。虽然到目前为止我已经创建了一个存储过程：

CREATE PROCEDURE getStudent_Paging
(   
    @PageIndex INT,
    @PageSize INT,  
)
AS
BEGIN
SET NOCOUNT ON;
DECLARE @minIndex int,
        @maxIndex int

SET @minIndex = (@PageIndex * @PageSize) + 1;
SET @maxIndex = (@PageIndex +1) * @PageSize;

SELECT ROW_NUMBER() OVER (ORDER BY ID ASC)AS RowNumber, * INTO #Results
FROM dbStudent;

SELECT @TotalRows  = COUNT(*) FROM #Results;

SELECT * FROM #Results WHERE RowNumber BETWEEN' + 
@minIndex + 'AND' + @maxIndex + ';  

DROP TABLE #Results

END

我还展示了前 5 条记录。但是在导航按钮中应该做些什么来导航到另一个页面。

我的控制器逻辑：

public ActionResult Index()
{
    DatabaseConnString db = new DatabaseConnString();
    SqlConnection conn = db.ConnectDB();

    List<StudentClass> list = new List<StudentClass>();

    SqlCommand myCommand = new SqlCommand("getStudent_Paging", conn); 
    myCommand.CommandType = CommandType.StoredProcedure;    
    myCommand.Parameters.AddWithValue("@PageIndex", pageIndex);    
    myCommand.Parameters.AddWithValue("@PageSize", pageSize);    

    SqlDataReader reader = myCommand.ExecuteReader();    
    while (reader.Read())
    {
        int ID = Int32.Parse(reader["ID"].ToString());
        string Name = reader["Name"].ToString();
        string Address = reader["Address"].ToString();
        string PhoneNumber = reader["PhoneNumber"].ToString();

        StudentClass model = new StudentClass
        {
            ID = ID,
            Name = Name,
            Address = Address,
            PhoneNumber = PhoneNumber
        };

        list.Add(model);
    }

    return View(list);
}
4

1 回答 1

0

使用表格数据的占位符创建基本页面（例如 Index.cshtml）：

<div id="tableData"></div>

使用 url /items 为您的控制器创建控制器操作 GetData(int skip, int take)。它应该像这样返回部分视图：

@foreach (var item in this.Model.rows)
{
    <div>@item.property</div>
}
<div onclick="loadPage(@Model.pageIndex)">Next page</div>

在 Index.cshtml 加载后调用 loadPage(0) 将第一页加载到占位符#tableData。单击“下一页”项以加载下一页。'loadPage' javascript 函数可能如下所示：

function loadPage(pageIndex) {
    $("#tableData").load("/items?skip=" + (pageIndex * 10) + "&take=10");
}

如果您熟悉 javascript，那么您当然不应该将“下一页”项目添加到部分视图并每次通过 http 更新它，而只是在客户端进行修改。但我认为这是足够的起点信息。祝你好运！

于 2013-12-12T21:12:11.567 回答