在asp.net中排序表mvc

如何使用asp.net對錶進行排序/過濾？我不確定如何去做，我必須使用jQuery。研究，但我沒有看到如何處理這個問題。在asp.net中排序表mvc

<table> 
     <tr> 
      <th class="col-lg-3 tablehead">Expense Account</th> 
      <th class="col-lg-3 tablehead">Description</th> 
      <th class="col-lg-3 tablehead">Requisition Number</th> 
      <th class="col-lg-3 tablehead">Item Number</th> 

     </tr> 
     @for (int i = 0; i < Model.Count; i++) 
     { 

      <tr> 
       <td>@Html.CheckBoxFor(m => m[i].postTrnx)</td> 
       @* <td class="label">@Html.DisplayFor(m => m[i].requisitionNumber) </td>*@ 
       @*<td class="label">@Html.DisplayFor(m => m[i].transactionDate)</td>*@ 


      </tr> 
      foreach (var item in Model[i].items) 
      { 
       @Html.HiddenFor(m => item.description) 
       @Html.HiddenFor(m => item.expense_account) 
       @Html.HiddenFor(m => item.itemNumber) 
       <tr> 
        <td class="col-lg-3 tabledata">@item.expense_account.account_desc</td> 
        <td class="col-lg-3 tabledata">@item.description</td> 
        <td class="label">@Html.DisplayFor(m => m[i].requisitionNumber) </td> 
        <td class="col-lg-3 tabledata">@item.itemNumber</td> 
        <td class="col-sm-1 tabledata">@item.quantity</td> 
        <td class="col-sm-1 tabledata">@item.selecteduomtext </td> 
        <td class="col-sm-1 tabledata">@item.price</td> 
        <td class="col-sm-1 tabledata">@item.extended_cost</td> 
        <td class="label">@Html.DisplayFor(m => m[i].transactionDate)</td> 
        <td>@Html.ActionLink("Edit", "Edit", new { id = @item.lineNum, name = Model[i].docNumber })</td> 
       </tr> 

} 
      } 

    </table>

來源

2017-10-13 Lenrice Sujae

你想在頁面加載時進行默認排序嗎？或者你希望用戶能夠在頁面加載後動態排序？或兩者？ – mason

您可以使用DataTables https://datatables.net/。默認配置支持過濾和排序。這是客戶端，但很好。 – Waragi

@Waragi他使用Bootstrap來判斷類。 [FooTable]（HTTP：//fooplugins.github。io/FooTable /）比使用Bootstrap的DataTable更好。 – mason

要讓用戶對html表進行排序，您可以使用JQuery插件。由於我到目前爲止只使用了數據表，我會給你一個例子。有關安裝說明，請參閱official website。使用非常簡單，只需撥打電話

<script>$('table').DataTable();</script>

在html文件的末尾。

確保按照文檔中的說明包含DataTable插件。

來源

2017-10-13 21:02:12 Wndrr

用篩選器顯示一個示例 –

我看不到它正在排序 –

您能描述當您說「排序」時您期望的行爲嗎？你想要什麼輸出？ – Wndrr

既然你希望用戶能夠通過單擊，您可以使用DataTables.net列對錶進行排序，正如其他人建議，或者你可以自己用下面的一般步驟做：

添加客戶端將javascript事件添加到要排序的每個列標題元素中，這將調用相應的控制器操作。
添加服務器端控制器操作事件以處理對服務器上的數據進行排序。
在click事件中，執行ajax局部頁面回調以調用服務器端操作事件。
在控制器操作事件中根據需要對數據進行排序。
在客戶端ajax響應更新/加載新的表格元素。
跟蹤每列的當前排序順序。

這可能更容易使用DataTables.net因爲自己做這可能需要更多的研究。

一些鏈接，以幫助：

來源

2017-10-13 21:23:19 Soenhay

我們不要回答太寬泛的問題。 – mason

在asp.net中排序表mvc

回答

相關問題