我有一個頁面助手，它創建帶有特定表單頁碼的提交按鈕串列：
public static IHtmlContent PageButtons(this IHtmlHelper html, PagingInfo pagingInfo)
{
var listOfButtons = new TagBuilder("li");
listOfButtons.AddCssClass("markers_list_list");
for (int i = 1; i <= pagingInfo.TotalPages; i )
{
TagBuilder button = new ("button");
button.MergeAttribute("type", "submit");
button.MergeAttribute("form", "mainForm");
button.InnerHtml.AppendHtmlLine(i.ToString());
if ((i < (pagingInfo.CurrentPage - 5) || i > (pagingInfo.CurrentPage 5)) && (i > 1 & i < pagingInfo.TotalPages))
button.AddCssClass("d-none");
if (i == pagingInfo.CurrentPage)
{
button.AddCssClass("selected");
button.AddCssClass("btn-primary");
}
button.AddCssClass("btn btn-default");
listOfButtons.InnerHtml.AppendHtml(button);
}
return listOfButtons;
}
在我看來，我是這樣使用它的：
<div class="entities_list_page_links">
@Html.PageButtons(Model.PagingInfo))
</div>
現在，當單擊某個按鈕時，我希望與該按鈕關聯的數字作為查詢引數傳遞。我怎么做？
uj5u.com熱心網友回復：
你可以使用ajax來實作它。因為你<button/>是在你的自定義html助手中生成的，所以我不能直接在上面添加onclick方法，所以我使用JS動態添加'click（）'方法。
<div class="entities_list_page_links">
@Html.PageButtons(Model)
</div>
@section Scripts{
<script>
$(document).ready(function(){
$('.entities_list_page_links').find('button').click(function(){
var CurrentPage = $(this).text();
//send request
$.get("/Home/Privacy?CurrentPage=" CurrentPage);
})
})
</script>
}
演示：
已編輯===========================
視圖模型
public class PagingInfoViewModel
{
public PagingInfo pagingInfo { get; set; }
public int CurrentPage { get; set; }
}
頁
@model PagingInfoViewModel
<form asp-action="Demo" method="get" id="mainForm">
@* add the hidden input to send the page number *@
<input name="CurrentPage" type="hidden" id="current" value=""/>
<div class="entities_list_page_links">
@Html.PageButtons(Model.pagingInfo)
</div>
</form>
@section Scripts{
<script>
$(document).ready(function(){
$('.entities_list_page_links').find('button').click(function(){
var CurrentPage = $(this).text();
//pass the page number from button to hidden input
$('#current').attr("value",CurrentPage);
})
})
</script>
}
轉載請註明出處，本文鏈接：https://www.uj5u.com/houduan/495007.html
標籤：C＃ asp.net-mvc asp.net 核心 剃刀