Asp.net MVC5 局部刷新 Ajax

先安裝改js包

主頁面的代碼主頁文件代碼Index.cshtml

@model IEnumerable<Nineksy.Models.LabTable>
 
@{
    ViewBag.Title = "Index";
    Layout = "~/Views/Shared/_MainView.cshtml";
}
 
<div class="mrcTable">
 
    @using (Ajax.BeginForm("GetrListLabResult", "TeaBespeakLab",
        new AjaxOptions
        {
            InsertionMode = InsertionMode.ReplaceWith,
            HttpMethod = "Get",
            OnFailure = "searchFailed",
            LoadingElementId = "load_ajax",
            UpdateTargetId = "mrcTableContent"
        }))
    {
        <div class="mrcTableNav">
            <input type="text" name="name" id="" placeholder=" 實驗室名稱" class="mrcTableNav-input">
            <button name="" id="btSelect" class="btn btn-success" type="submit"><i class="Hui-iconfont">&#xe665;</i> 搜資訊</button>
        </div>
    }
 
    <div id="load_ajax" style="display: none">
        正在載入.........
    </div>

    <div class="mrcTableContent" id="mrcTableContent">
  
    </div>
</div>
 主頁面的後臺代碼

public  ActionResult Index(int page=1)
{
    LabListVm model = new LabListVm
    {
        LabListTables = _db.LabTables.OrderBy(d => d.LabId).Skip((page - 1) * _pageSize).Take(_pageSize),
        PagingInfo = new PagingInfo
        {
            CurrentPage = page,
            ItemsPerPage = _pageSize,
            TotalItems = _db.DeviceTables.Count()
        }
    };
    return View(model);
}
後臺用到的類

public class LabListVm
{
    public static int PageSize = int.Parse(ConfigurationManager.AppSettings["pageSize"]);
    public IEnumerable<LabTable> LabListTables { get; set; }
    public PagingInfo PagingInfo { get; set; }
}

public class LabTable
{
    public int LabTableId { get; set; }
    
    public string LabId 
    { set; get; }
 

    public string LabName 
    { set; get; }
 
    
    public string LabAddress 
    { set; get; }
 
   
    public string LabStatus
    { set; get; }
 
    
    public int? LabUseNum 
    { set; get; }
 

    public string LabSynopsis 
    { set; get; }

}
局部頁代碼文件名

_LabListSelect.cshtml

@using Web.BLL;
@model Web.Areas.LabArea.Models.LabListVm

<div class="mrcTableContent" id="mrcTableContent">
    <div class="mrcTableContentbody">
        <table class="table table-border table-bordered table-bg table-hover table-width">
            <thead>
                <tr class="text-c">
 
 
                    <th width="80">實驗室編號</th>
                    <th>實驗室名稱</th>
                    <th width="80">實驗室地址</th>
                    <th width="80">實驗室狀態</th>
 
                    <th width="75">實驗室使用次數</th>
                    <th width="120">實驗室簡介</th>
                </tr>
            </thead>
            <tbody>
                @foreach (var item in Model.LabListTables)
                {
                    <tr class="text-c">
                        <td>
                            @Html.DisplayFor(modelItem => item.LabId)
                        </td>
                        <td>
                            @Html.DisplayFor(modelItem => item.LabName)
                        </td>
                        <td>
                            @Html.DisplayFor(modelItem => item.LabAddress)
                        </td>
                        <td>
                            @Html.DisplayFor(modelItem => item.LabStatus)
                        </td>
                        <td>
                            @Html.DisplayFor(modelItem => item.LabUseNum)
                        </td>
                        <td>
                            @Html.DisplayFor(modelItem => item.LabSynopsis)
                        </td>
  
                    </tr>
                }
 
            </tbody>
        </table>
    </div>
    <div class="pagehtml">
        <div class="pages">
            <div class="pagingtext">
                每頁 @Model.PagingInfo.ItemsPerPage 條記錄，共 @Model.PagingInfo.TotalPages 頁，當前第 @Model.PagingInfo.CurrentPage 頁
            </div>
 
            @Html.PageLinksHtmlString(Model.PagingInfo, d => Url.Action("Index", new { page = d }))
        </div>
    </div>
 
</div>
局部頁需要後臺代碼

public ActionResult GetrListLabResult(string name,int page=1)
{
    
        LabListVm labs=new LabListVm
        {
            LabListTables = db.LabTables.Where(lb => lb.LabName == name).OrderBy(d => d.LabId).Skip((page - 1) * LabListVm.PageSize).Take(LabListVm.PageSize),
            PagingInfo = new PagingInfo
            {
                CurrentPage = page,
                ItemsPerPage = LabListVm.PageSize,
                TotalItems = db.LabTables.Count()
            }
 
        };
        return PartialView("_LabListSelect",labs);
}