2

MVC3 アプリケーションにページングを実装しました。各ページ番号をクリックすると、ポストバックが発生し、要求されたページが適切に表示されます。

以下は私の拡張コードです -

public static string PageLinks(this HtmlHelper html, PageLinks pagelinks, Func<int, string> pageUrl)
        {
            StringBuilder result = new StringBuilder();
            int startFrom;
            //Previous Page link
            int divi = (int)pagelinks.Current / pagelinks.PageLinksToDisplay;
            if (divi > 0)
            {
                TagBuilder tag = new TagBuilder("a"); // Construct an <a> tag
                tag.MergeAttribute("href", pageUrl((divi * pagelinks.PageLinksToDisplay) - 1));
                tag.InnerHtml = "Prev";
                result.AppendLine(tag.ToString());
            }
            if (divi > 0)
            {
                startFrom = (divi * pagelinks.PageLinksToDisplay);
            }
            else
            {
                startFrom = (divi * pagelinks.PageLinksToDisplay) + 1;
            }
            int endOn = (startFrom + pagelinks.PageLinksToDisplay);
            if (endOn > pagelinks.Total + 1)
                endOn = pagelinks.Total + 1;

            for (int i = startFrom; i < endOn; i++)
            {
                TagBuilder tag = new TagBuilder("a"); // Construct an <a> tag
                tag.MergeAttribute("href", pageUrl(i));
                tag.InnerHtml = i.ToString();
                if (i == pagelinks.Current)
                    tag.AddCssClass("selected");
                result.AppendLine(tag.ToString());
            }

            if (endOn < pagelinks.Total)
            {
                TagBuilder tag = new TagBuilder("a"); // Construct an <a> tag
                tag.MergeAttribute("href", pageUrl(endOn));
                tag.InnerHtml = "Next";
                result.AppendLine(tag.ToString());
            }
            return result.ToString();
        } 

以下は、ページングを実装するための私のビューのソースコードです -

<!-- Paging Strip -->
           <div class="PagerDiv">
                <div class="pagerCurrent">
                <%
                    int? currentPgNo = Model.Pager.Current;
                    int totalItems = Model.Pager.TotalItemCount;
                    int displayRecs = Model.Pager.PageSize;
                %>
                    Showing  <%=(currentPgNo * displayRecs) - (displayRecs - 1)%> - 
                    <%=(currentPgNo * displayRecs < totalItems ? currentPgNo * displayRecs : totalItems)%>
                    out of <%=totalItems%> 
                </div>
                <div class="pager">
                    <%=Html.PageLinks(Model.Pager, x => Url.Action("Index", new { Current = x }))%>
                </div>
                <div class="options">

                    Sort By : <%:Html.DropDownListFor(m=>m.SortBy, Model.SortOptions, new { onchange = "this.form.submit();" })%>
                </div>
            </div>
           <!-- End Paging-->

以下は出力です- ページャ

問題 :-

ここまでは順調ですね。私は新たな困難に直面しています。json を介してデータがレンダリングされる Div を含むビューを持っています。部分ビューの 1 つを Json としてレンダリングしています。この部分的なビューは、ページングを実装する必要があるリストを示しています。ポストバックしたくない代わりに、新しくレンダリングされたjsonをDivに表示する必要があります。

コード

<%=Html.PageLinks(Model.Pager, x => Url.Action("Index", new { Current = x }))%>

実際に番号付きボックスを生成します。私が望むのは、これらの番号付きボックスに URL の代わりに JS 関数をアタッチすることです。

のようにしてみました

<%=Html.JQueryPageLinks(Model.Pager, x => "MyJSFunction(" + x + ")")%>

ここで、x はページ番号を表します。別の拡張機能を作成していますが、運が悪いようです。

ここにコードがあります -

public static string JQueryPageLinks(this HtmlHelper html, PageLinks pagelinks, string jQryFn)
        {
            StringBuilder result = new StringBuilder();
            int startFrom;
            //Previous Page link
            int divi = (int)pagelinks.Current / pagelinks.PageLinksToDisplay;
            if (divi > 0)
            {
                TagBuilder tag = new TagBuilder("a"); // Construct an <a> tag
                //tag.MergeAttribute("href", pageUrl((divi * pagelinks.PageLinksToDisplay) - 1));
                tag.Attributes.Add("onclick", jQryFn);
                tag.InnerHtml = "Prev";
                result.AppendLine(tag.ToString());
            }
            if (divi > 0)
            {
                startFrom = (divi * pagelinks.PageLinksToDisplay);
            }
            else
            {
                startFrom = (divi * pagelinks.PageLinksToDisplay) + 1;
            }
            int endOn = (startFrom + pagelinks.PageLinksToDisplay);
            if (endOn > pagelinks.Total + 1)
                endOn = pagelinks.Total + 1;

            for (int i = startFrom; i < endOn; i++)
            {
                TagBuilder tag = new TagBuilder("a"); // Construct an <a> tag
                //tag.MergeAttribute("href", pageUrl(i));
                tag.Attributes.Add("onclick", jQryFn);
                tag.InnerHtml = i.ToString();
                if (i == pagelinks.Current)
                    tag.AddCssClass("selected");
                result.AppendLine(tag.ToString());
            }

            if (endOn < pagelinks.Total)
            {
                TagBuilder tag = new TagBuilder("a"); // Construct an <a> tag
                //tag.MergeAttribute("href", pageUrl(endOn));
                tag.Attributes.Add("onclick", jQryFn);
                tag.InnerHtml = "Next";
                result.AppendLine(tag.ToString());
            }
            return result.ToString();
        }

誰かがこの問題を整理するのを手伝ってくれますか? 貴重な時間と知恵を共有していただきありがとうございます。

EDIT: 最も簡単に言えば、URLではなくページ番号でJS関数呼び出しが必要です。たとえば。
1 をクリックすると MyJSFunction(1) が呼び出され、2 をクリックすると MyJSFunction(2) が呼び出されます。

4

1 に答える 1