jquery插件,包含多个表的tablesorter寻呼机

时间:2013-02-03 02:49:51

标签: jquery asp.net-mvc

我正在尝试使用asp.net/mvc3在多个表上使用jQuery tablesorter插件。我正在学习本教程: http://weblogs.asp.net/hajan/archive/2011/02/09/table-sorting-amp-pagination-with-jquery-in-asp-net-mvc.aspx

我的页面上有两个不同的表格。我希望能够使用此插件为每个表设置行数。我遇到的一个问题是默认情况下表格具有第一个表格所显示的行数。然后我就可以在每张桌子上使用插件了。例如,在表1下面,我有这个:

<div id="pagerOwnerRequests">
    <form>
        <select id="selectOwnerRequests" class="pagesize">
        @*<select id="selectOwnerRequests" class="pagesizeOwnerRequests">*@
            <option selected="selected" value="0">0</option>
            <option value="2">2</option>
            <option value="10">10</option>
        </select>
    </form>
    </div>

在表2中,我有:

<div id="pagerBoardRequests">
    <form>
        <select id="selectBoardRequests" class="pagesize">
            <option selected="selected" value="1">1</option>
            <option value="2">2</option>
            <option value="10">10</option>
        </select>
    </form>
    </div>

在此页面的.cshtml文件的底部,我有:

    $(document).ready(function () {
        $("#tbOwnerRequests").tablesorter({
              headers: {
                 6: {
                        sorter: false
                    }
                }
            }
        ).tablesorterPager({ container: $("#pagerOwnerRequests"), size: $(".pagesize option:selected").val() });
    });
$(document).ready(function () {
        $("#tbBoardRequests").tablesorter({
                headers: {
                    7: {
                        sorter:false
                    }
                }
            }
        ).tablesorterPager({ container: $("#pagerBoardRequests"), size: $(".pagesize option:selected").val() });
    });

那么当页面加载时会发生什么,因为表1的下拉列表设置为0,表1和表2都有0个元素。然后,当我手动进入并更改表1或表2的下拉列表时,它会正确更新。我不知道为什么。我刚开始使用jQuery / html / css很抱歉,如果答案很明显,但我似乎无法看到它。 TIA。

1 个答案:

答案 0 :(得分:0)

检查一下 http://www.datatables.net/

此插件在mi工作中效率太高