如何在使用ajax的ASP.NET MVC部分视图中使用JQuery tablesorter插件？

Question

我有一个带有表格和JQuery tablesorter插件的视图。它运行得非常好。但是，当我尝试将表格和tablesorter插件插入到PartialView中，并通过Ajax将此PartialView插入到View页面中时，tablesorter无法工作。

在Partial View中，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>

- Michael

---

需要更多信息。部分视图请求是通过xhr调用吗？表格排序器连接在哪里？我们能看到一些代码/标记吗？当你说它不起作用时，你的意思是什么？插件被调用了吗？ - redsquare

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

Answer 1

你是否已经查看了渲染页面的实际源代码？从实际网页上应该能够看出问题所在。

- Robert Harvey

Answer 2

当您尝试使用ajax渲染部分视图时，您可能会发现$(document).ready函数从未被调用，值得在其中放置一个警报或其他内容以确认此情况。

- phil_h