JQuery，如果更新一次以上，则更新表单和异常答案

【问题标题】：JQuery, updating form and exception if update it more then onceJQuery，如果更新一次以上，则更新表单和异常
【发布时间】：2010-09-05 09:17:21
【问题描述】：

我有我的元素的索引：

<h2>Index</h2>
    <script type="text/javascript"
    src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $('button').click(function () {
                $.post("Home/Swap", $("#log").serialize(), function (data) {
                    $("#log").load("Home/Index #log");
                });
              });

         }); 
    </script> 

   <form name="list" action="<%=Url.Action("Post", "Home")%>" method="post" id="log">
    <% foreach (var k in Model) { %>
        <input type="checkbox" id="ids" name="ids" value="<%=k.pos%>" /><%= k.pos %>. To jest numer: <%=k.name%><br />
    <% } %>

    </form>
    <button>Swap</button>

和交换方法：

    public ActionResult Swap(int[] ids)
    {
        int pos1=ids[0];
        int pos2=ids[1];
        Element element1 = (from t in db.Elements
                            where t.pos == pos1
                            select t).Single();
        Element element2 = (from t in db.Elements
                            where t.pos == pos2
                            select t).Single();



        element1.pos = pos2;
        element2.pos = pos1;
        db.SaveChanges();

        return Index();
    }

在第一次交换元素时一切正常。但是当我交换一次，然后尝试交换另外两个时，我得到了一个异常：

System.NullReferenceException 是用户代码未处理
消息=对象引用未设置为对象的实例。

（交换方法的例外）这是 JQuery 的问题，我确定。我怀疑这条$("#log").load("Home/Index #log"); 行 - 它向我显示了正确的结果，但如果我尝试多做一次，它就不能正常工作。如何解决？

编辑：当我刷新页面时，它的工作原理相同 -> 在遇到异常后首先运行良好（刷新后交换第一个触摸的元素）

【问题讨论】：

标签： asp.net-mvc-2 jquery jquery-load

【解决方案1】：

当您执行.load("url selector") 时，它获取那个元素，而不是那个元素的内容，所以你最终得到一个嵌套的<form>，所以改为创建一个包装器并加载该包装器，因此您替换 <form>，如下所示：

<div id="wrapper">
<form name="list" action="<%=Url.Action("Post", "Home")%>" method="post" id="log">
  <% foreach (var k in Model) { %>
    <input type="checkbox" id="ids" name="ids" value="<%=k.pos%>" /><%= k.pos %>. To jest numer: <%=k.name%><br />
  <% } %>
  </form>
</div>
<button>Swap</button>

然后加载那个元素，因此您将替换 <form>，如下所示：

$(function () {
  $('button').click(function () {
    $.post("Home/Swap", $("#log").serialize(), function (data) {
      $("#wrapper").load("Home/Index #log");
    });
  });
});

【讨论】：