Sunny Dhiman

Sunny Dhiman

  • NA
  • 81
  • 5.2k

Render Number base on Page.

Jun 18 2021 7:26 AM

I have set paginantion using jquery and c# but i have face a issue not render number .

This is my code 

@{
        var prevDisabled = Model.IsFirstPage() ? "disabled" : "";
        var nextDisabled = Model.IsLastPage() ? "disabled" : "";
    }
    <div class="blog-agination">
        <div id="page-numbering" class="simple-pagination">
            <ul>
                <li class="active">
                    <a href="#" class="btn current prev  @prevDisabled" id="prev" data-Id="@(Model.PageNumber-1)">«</a>
                </li>
                <li class="active">
                    <a href="" class="current">@Model.PageNumber</a>

                </li>
                
                <li class="">
                    <a href="#" class="btn current next   @nextDisabled" id="next" data-Id="@(Model.PageNumber+1)">»</a>

                </li>
            </ul>
        </div>
    </div>
</section>

<script type="text/javascript">
    $('#prev').click(function (event) {
        event.preventDefault();
        var id = $(this).attr('data-Id');
        $.ajax({
            url: "/Utility/Blog?pageId=" + id,
            type: "POST",
            dataType: "html",
            traditional: true,
            contentType: "application/json; charset=utf-8",
            success: function (data) {
                $(".blog-layout-content").html("");
                $(".blog-layout-content").html(data);
            },
        });
    });
    $('#next').click(function (event) {
        event.preventDefault();
        var id = $(this).attr('data-Id');

        $.ajax({
            url: "/Utility/Blog?pageId=" + id,
            type: "POST",
            dataType: "html",
            traditional: true,
            contentType: "application/json; charset=utf-8",
            success: function (data) {
                $(".blog-layout-content").html("");
                $(".blog-layout-content").html(data);
            },
        });
    });

</script>

This is my result .I have click next button then change number 1 to 2 to 3 to 4 etc.

I want to render this 

-This is genrate using plugin .

 


Answers (1)