如何在 ASP.NET MVC 部分视图中使用 JQuery 表排序器插件？当我在视图中插入 PartialView 时，我使用的是 ajax

Posted 2023-05-08

【中文标题】如何在 ASP.NET MVC 部分视图中使用 JQuery 表排序器插件？当我在视图中插入 PartialView 时，我使用的是 ajax

【英文标题】：How can I use JQuery tablesorter plugin into ASP.NET MVC Partial View? When I insert PartialView in View, I'm using ajax

【发布时间】：2010-11-17 07:25:43

【问题描述】：

我有 View with table 和 JQuery tablesorter 插件。它工作得很好。但是，当我尝试将 table 和 tablesorter 插入 PartialView 并使用 Ajax 将此 PartialView 插入 View 页面时，tablesorter 不起作用。

进入局部视图不起作用 jquery。插件没有被调用。

我的控制器代码：

public ActionResult MyTable()
        
           //query type IQueryable

            return PartialView(query);
        

我的基本查看代码

...
    <% using (Ajax.BeginForm("MyOrgsTable", new AjaxOptions  UpdateTargetId="MyTable", InsertionMode = InsertionMode.Replace))
            %>  <p>
               Name:&nbsp<%=html.TextBox("search_org", ViewData["searchName"])%>&nbsp<input type="submit" value="Поиск" />
              </p>
        <%  %>

        <div id="MyTable">
        </div>
...

我的部分查看代码：

<script type="text/javascript" id="js">
    $(document).ready(function() 
        // call the tablesorter plugin
        $("table").tablesorter(
            headers: 
                5:  sorter: "MyDate" ,
                6:  sorter: "MyDate" 
            ,
            widthFixed: true,
            widgets: ['zebra']
        );
    ); 
</script>

<table  cellspacing="1" class="tablesorter">
<thead>
    <tr>
        ...
    </tr>
    </thead>
    <tbody>
    <% foreach ( var item in Model )
        %>
       // some table rows
    <%  %>
    </tbody>
</table>

我的母版页标题：

    <script type="text/javascript" src="<%= Url.Content("~/Scripts/MicrosoftAjax.js") %>"></script>
    <script type="text/javascript" src="<%= Url.Content("~/Scripts/MicrosoftMvcAjax.js") %>"></script>
    <script type="text/javascript" src="<%= Url.Content("~/Scripts/jquery-1.3.2.js") %>"></script>
    <script type="text/javascript" src="<%= Url.Content("~/Scripts/jquery.tablesorter.js") %>"></script>
    <script type="text/javascript" src="<%= Url.Content("~/Scripts/jquery.tablesorter.pager.js") %>"></script>

【问题讨论】：

需要更多信息。部分视图请求是通过 xhr 调用吗？ tablesorter 连接在哪里？我们可以看到一些代码/标记吗？当你说它不起作用时，你是什么意思。插件会被调用吗？

@Michael 你有解决方案吗？请回答您自己的问题。你最后做了什么？

【参考方案1】：

您是否查看过渲染页​​面的实际来源？从实际网页中应该可以看出问题所在。

【参考方案2】：

您可能会发现 $(document).ready 函数在您尝试时永远不会被调用 使用 ajax 渲染部分视图，值得在其中放置警报或其他内容以确认这一点。