在pagin概念脚本中没有加载 [英] In pagin concept script is not loading

问题描述

大家好，

我正在MVC项目中执行我的应用程序。我在搜索结果页面中实现了分页概念。我已经添加了分页脚本。但在运行应用程序脚本时未在我的控制台中加载。

我在下面分享我的代码

Hi all,
I am doing my application in MVC project. I am implementing the paging concept in my search result page. I have added the script for paging. but while running the application script is not loading in my console.
I have share my code below

<div id="sortMsg" style="text-align:center;color:Red;"></div>
        <table border="1" id="empTable" style="width:50%;removed:default">
            @if (Model != null)
            {
                if (Model.Count() != 0)
                {

                    <tbody>


                        @foreach (var item in Model)
                        {

                            <tr>
                                <td>
                                    <div class="tiptext">
                                        @item.BusinessName
                                        <h3 style="margin: 5px 0px 5px 0px;color: rgb(0, 145, 0);"> @item.FirstName</h3>
                                        <h3 style="margin: 8px; color:black">@item.BusinessCategory </h3>
                                        <div class="description">
                                            <div class="description_image">
                                                <img src="~/Images/popup_pointer.jpg" />
                                                <div class="POP_UP_outer">
                                                    <div class="description_background">
                                                        <div class="description_map">
                                                            Map

                                                        </div><hr />
                                                        <div class="description_body">
                                                            Description <h4 class="des">@item.BusinessDescription</h4>
                                                            Address2 <h4 class="des">@item.Address1</h4>
                                                            Email <h4 style="color:blue; margin: 5px 0px 5px 0px;">@item.EmailID </h4>
                                                            WorkNumber <h4 class="des">@item.WorkNumber</h4>
                                                            MobileNumber <h4 class="des">@item.MobileNumber</h4>
                                                            City <h4 class="des">@item.City</h4>
                                                            State <h4 class="des">@item.State</h4>
                                                            ZipCode <h4 class="des">@item.ZipCode</h4>
                                                            @Html.ActionLink("Book An Appointment", "CalendarView", "Appt", new { id = @item.UserID }, null)
                                                           
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </td>
                            </tr>


                        }


                    </tbody>

                }
                else
                {
                    <label id="lblErrorMsg" title="Record not fount...!" style="color:red;">Record not found...!</label>
                }
            }
        </table>
    </div>

</div>

<hr />

<div id="pager" class="pager">
    <br />
    <img src="~/Content/first.png" class="first" />
    <img src="~/Content/prev.png" class="prev" />
    <input type="text" class="pagedisplay" />
    <img src="~/Content/next.png" class="next"  />

    <img src="~/Content/last.png" class="last" />
    <select class="pagesize">
        <option selected="selected" value="10">10</option>
        <option value="20">20</option>
        <option value="30">30</option>
        <option value="40">40</option>
    </select>

<script type="text/javascript">
    $(function () {
        debugger;
        $("#empTable")
        .tablesorter({ widthFixed: true })
        .tablesorterPager({ container: $("#pager") });
        $("#empTable").bind("sortStart", function () {
            $("#sortMsg").html('Sorting');
        }).bind("sortEnd", function () {
            $("#sortMsg").html('');
        });
        //Hide/delete row on click.Used live() to apply this click event for all the matching rows.
        $("#empTable img").live("click", function () {
            tablesorter_remove($(this).parent().parent(), $('#empTable'));
        });
    });
    //Start of Page Size adjust on Row Delete
    Array.prototype.remove = function (from, to) {
        var rest = this.slice((to || from) + 1 || this.length);
        this.length = from < 0 ? this.length + from : from;
        return this.push.apply(this, rest);
    };

    //repopulate table with data from rowCache
    function repopulateTableBody(tbl) {
        debugger;

        //aka cleanTableBody from TableSorter code
        if ($.browser.msie) {
            function empty() {
                while (this.firstChild) this.removeChild(this.firstChild);
            }
            empty.apply(tbl.tBodies[0]);
        } else {
            tbl.tBodies[0].innerHTML = "";
        }
        jQuery.each(tbl.config.rowsCopy, function () {
            tbl.tBodies[0].appendChild(this.get(0));
        });
    }
    //removes the passed in row and updates the tablesorter+pager
    function tablesorter_remove(tr, table) {
        debugger;
        //pager modifies actual DOM table to have only #pagesize TR's
        //thus we need to repopulate from the cache first
        repopulateTableBody(table.get(0));
        var index = $("tr", table).index(tr);
        var c = table.get(0).config;
        tr.remove();

        //remove row from cache too
        c.rowsCopy.remove(index);
        c.totalRows = c.rowsCopy.length;
        c.totalPages = Math.ceil(c.totalRows / config.size);

        //now update
        table.trigger("update");
        table.trigger("appendCache");

        //simulate user switches page to get pager to update too
        index = c.page < c.totalPages - 1;
        $(".next").trigger("click");
        if (index)
            $(".prev").trigger("click");
    }
    //End of Page Size adjust on Row Delete
</script>

推荐答案

（function（）{
debugger;

(function () { debugger;

（ ＃empTable）
.tablesorter（{widthFixed： true }）
.tablesorterPager（{container：

("#empTable") .tablesorter({ widthFixed: true }) .tablesorterPager({ container:

（ ＃pager）}）;

这篇关于在pagin概念脚本中没有加载的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！