0

如何在 mvc 中使用 ajax 和 jquery 进入下一页?

我正在使用下面的代码

    @model DGM.Common.PageInput
@using System.Globalization
<link href="~/Content/themes/jquery-ui.css" rel="stylesheet" />
<script src="~/Scripts/jquery-ui-1.8.24.min.js"></script>

<script>
    function NextPage() {
        //TODO
    }
</script>
<div class="scroll-pane ui-widget ui-widget-header ui-corner-all">

    <div class="scroll-content" style="display: inline-table">

        @for (int i = 1; i < Model.CountPage + 1; i++)
        {
            string idParametr = Model.NameIdParametr;
            short valueIdParametr = Model.ValueIdParametr;

            var routeValueDictionary = new RouteValueDictionary
            {
                {idParametr, valueIdParametr},
                {"countryNo", Model.CountryNo},
                {"count", Model.CountRecordInPage},
                {"page", i}
            };
            if (Model.IsSearch)
            {
                routeValueDictionary.Add("search", Model.TextSearch);
            }


            @Ajax.ActionLink(i.ToString(CultureInfo.InvariantCulture), Model.ActionName, Model.Controller,
                routeValueDictionary,
                new AjaxOptions
                {
                    HttpMethod = "POST",
                    OnSuccess = "OnSuccess",
                    UpdateTargetId = "grid-list",
                    InsertionMode = InsertionMode.Replace

                }, new Dictionary<string, object>
                {
                    {"class", "scroll-content-item ui-widget-header"},
                    {"onclick", "clickfunc(this)"}
                })
        }

    </div>
    <div class="scroll-bar-wrap ui-widget-content ui-corner-bottom">
        <div class="scroll-bar"></div>
    </div>

</div>
<div class="InfoPaging" style="margin: 0 auto; text-align: center;">
    <a id="LastPage"href="javascript:void(0);" style="color: blue; padding: 0 10px">Last Page</a>
    <a id="NextPage" onclick="NextPage()"  href="javascript:void(0);" style="color: blue; padding: 0 10px">Next Page</a>
    <a id="PreviousPage" href="javascript:void(0);" style="color: blue; padding: 0 10px">Previous Page</a>
    <a id="FirsPpage" href="javascript:void(0);" style="color: blue; padding: 0 10px">First Page</a>

</div>

页面输入类:

  public class PageInput
    {
        public string ActionName { get; set; }
        public string Controller { get; set; }
        public int CountPage { get; set; }
        public int AllRecord { get; set; }
        public string NameIdParametr { get; set; }
        public short ValueIdParametr { get; set; }
        public decimal CountryNo { get; set; }
        public int CountRecordInPage { get; set; }
        public bool IsSearch { get; set; }
        public string TextSearch { get; set; }
        public int CurrentPage { get; set; }
    }

我对这项工作没有任何想法。我不知道我应该使用什么。我应该使用 jQuery 吗?我对这项工作没有任何想法。我不知道我应该使用什么。我应该使用 jQuery 吗?

更新 :

我试过以下。但它总是显示第二页

@{
    idParametr = Model.NameIdParametr;
    valueIdParametr = Model.ValueIdParametr;

    routeValueDictionary = new RouteValueDictionary
    {
        {idParametr, valueIdParametr},
        {"countryNo", Model.CountryNo},
        {"count", Model.CountRecordInPage},
        {"page", ++Model.CurrentPage}
    };
    if (Model.IsSearch)
    {
        routeValueDictionary.Add("search", Model.TextSearch);
    }

}
    @Ajax.ActionLink("Next Page", Model.ActionName, Model.Controller,
        routeValueDictionary,
        new AjaxOptions
        {
            HttpMethod = "POST",
            OnSuccess = "OnSuccess",
            UpdateTargetId = "grid-list",
            InsertionMode = InsertionMode.Replace

        })
4

1 回答 1

0

我发现 :

更新部分视图:

function NextPage() {
        var dataToSend = @Html.Raw(Json.Encode(Model));
        dataToSend.CurrentPage = @Model.CurrentPage + 1;
        $.ajax({
            url: '@Url.Action("GetPageNumbers", "Class")',
            data: dataToSend,
            success: function(dataa) {
                $('#PagingList').html(dataa);
                $('#PagingListUp').html($('#PagingList').html());
            }
        });
    }

使用下一页的操作链接:

    @{
            idParametr = Model.NameIdParametr;
            valueIdParametr = Model.ValueIdParametr;

            routeValueDictionary = new RouteValueDictionary
            {
                {idParametr, valueIdParametr},
                {"countryNo", Model.CountryNo},
                {"count", Model.CountRecordInPage},
                {"page", Model.CurrentPage+1}
            };
            if (Model.IsSearch)
            {
                routeValueDictionary.Add("search", Model.TextSearch);
            }
        }



        @Ajax.ActionLink("Next Page", Model.ActionName, Model.Controller,
                    routeValueDictionary,
                    new AjaxOptions
                    {
                        HttpMethod = "POST",
                        OnSuccess = "OnSuccess",
                        UpdateTargetId = "grid-list",
                        InsertionMode = InsertionMode.Replace

                    }, new Dictionary<string, object>
                    {
                         {"onclick", "NextPage()"}


})
于 2013-10-29T08:58:55.843 回答