頁面編號的MVC頁面顯示問題

在我看來，我已經實現了分頁，一切看起來都不錯。但是，頁碼的格式不是我所期望的。它顯示的頁面索引這樣：頁面編號的MVC頁面顯示問題

點擊該鏈接的作品，但它應該在直排

這裏已經顯示的東西是我的看法代碼

<table> 
    <tr> 
     <th> 
      Account Type 
     </th> 
     <th> 
      Account #1 
     </th> 
     <th> 
      Account #2 
     </th> 
     <th> 
      Amount 
     </th> 
     <th> 
      Comment 
     </th> 
     <th> 
      Date 
     </th> 

    </tr> 

    @foreach (var item in Model) 
    { 
    <tr> 
     <td> 
      @Html.DisplayFor(modelItem => item.TransactionType) 
     </td> 
     <td> 
      @Html.DisplayFor(modelItem => item.AccountNumber) 
     </td> 
     <td> 
      @Html.DisplayFor(modelItem => item.DestAccount) 
     </td> 
     <td> 
      @Html.DisplayFor(modelItem => item.Amount) 
     </td> 
     <td> 
      @Html.DisplayFor(modelItem => item.Comment) 
     </td> 
     <td> 
      @Html.DisplayFor(modelItem => item.ModifiedDate) 
     </td> 

    </tr> 
} 
</table> 

@Html.PagedListPager(Model, page => Url.Action("Index",new {page}))

這裏是生成頁面的html

enter code here 

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8" /> 
    <meta name="viewport" content="width=device-width" /> 
    <title>Statements</title> 
    <link href="/Content/site.css" rel="stylesheet"/> 

    <script src="/Scripts/modernizr-2.5.3.js"></script> 

</head> 
<body> 



      <div id="midNav"> 
       <a href="/ATM">ATM</a> 
       <span> | </span> 
       <a href="/Statement">Statement</a> 
       <span> | </span> 
       <a href="/Customer">My Profile</a> 
      </div> 
      <div id="nav"> 
       <strong>dalmar202</strong> 
       <span> | </span> 
       <a href="/User/LogOut">Log Out</a> 
      </div>   




    <div id="content" > 



<h2>Your Statements</h2> 

<select id="Accounts" name="Accounts"><option value="">-- Select Account --</option> 
<option value="1">1</option> 
<option value="2">2</option> 
</select> 

<table> 
    <tr> 
     <th> 
      Account Type 
     </th> 
     <th> 
      Account #1 
     </th> 
     <th> 
      Account #2 
     </th> 
     <th> 
      Amount 
     </th> 
     <th> 
      Comment 
     </th> 
     <th> 
      Date 
     </th> 

    </tr> 

    <tr> 
     <td> 
      D 
     </td> 
     <td> 
      1 
     </td> 
     <td> 
      1 
     </td> 
     <td> 
      150.00 
     </td> 
     <td> 
      saad 
     </td> 
     <td> 
      26/09/2013 8:49:19 PM 
     </td> 

    </tr> 
    <tr> 
     <td> 
      D 
     </td> 
     <td> 
      2 
     </td> 
     <td> 
      2 
     </td> 
     <td> 
      50.00 
     </td> 
     <td> 
      saad 
     </td> 
     <td> 
      26/09/2013 9:00:29 PM 
     </td> 

    </tr> 
    <tr> 
     <td> 
      D 
     </td> 
     <td> 
      2 
     </td> 
     <td> 
      2 
     </td> 
     <td> 
      150.00 
     </td> 
     <td> 
      ss 
     </td> 
     <td> 
      26/09/2013 9:41:09 PM 
     </td> 

    </tr> 
    <tr> 
     <td> 
      D 
     </td> 
     <td> 
      1 
     </td> 
     <td> 
      1 
     </td> 
     <td> 
      0.00 
     </td> 
     <td> 

     </td> 
     <td> 
      26/09/2013 10:10:58 PM 
     </td> 

    </tr> 
    <tr> 
     <td> 
      D 
     </td> 
     <td> 
      1 
     </td> 
     <td> 
      1 
     </td> 
     <td> 
      0.00 
     </td> 
     <td> 

     </td> 
     <td> 
      26/09/2013 10:19:07 PM 
     </td> 

    </tr> 
</table> 

<div class="pagination"><ul><li class="active"><a>1</a></li><li><a href="/Statement?page=2">2</a></li><li><a href="/Statement?page=3">3</a></li><li><a href="/Statement?page=4">4</a></li><li><a href="/Statement?page=5">5</a></li><li><a href="/Statement?page=6">6</a></li><li><a href="/Statement?page=7">7</a></li><li><a href="/Statement?page=8">8</a></li><li><a href="/Statement?page=9">9</a></li><li><a href="/Statement?page=10">10</a></li><li class="disabled PagedList-ellipses"><a>&#8230;</a></li><li class="PagedList-skipToNext"><a href="/Statement?page=2">»</a></li><li class="PagedList-skipToLast"><a href="/Statement?page=45">»»</a></li></ul></div> 


     <script src="/Scripts/jquery-1.7.1.js"></script> 



    </div> 

    <div id="footer"></div> 
</body> 
</html>

來源

2013-09-29 kayze

您能分享正在生成的HTML標記嗎？ – Tentux

完成後，我編輯了包含html – kayze

的帖子。我應該添加這個int pageSize = 5; int pageNumber =（page ?? 1）; return View（statementModel.ToPagedList（pageNumber，pageSize））; – kayze

請執行以下操作

 

    .pagination ul { 
     margin-left: 10px; 
     list-style:none; 

    } 
    .pagination li { 
     display: inline; 

    }

來源

2013-12-14 02:59:17

頁面編號的MVC頁面顯示問題

回答

相關問題