Asp.net mvc 2 Asp.net mvc 2表单未通过Ajax发布到控制器

我正试图通过ajax将一个表单发布到我的控制器，这样我就可以呈现一个局部视图

这是我的Ajax代码

 var formCollection = $('#some-form');
 $(function(){ $('#some-form').submit(function(){
      $.ajax({
           type: "POST",
           url: "/Trusk/Index",
           data: formCollection,
           dataType: "html",
           success: function (result) {
               $('#newView').html(result);
           },
           error: function (request, status, error) {
               alert('Oh no!');
           }
     });
});
}); 

我希望部分视图在ID=newView时呈现，部分视图由控制器返回

  <% using (Html.BeginForm(new { @id = "some-form" }))
           { %>
            <div id="TestDiv">
            <div id="Title">Test</div>                 
                <div id="CheckIn">Check-in:<br />
                <%:Html.TextBox("FromDate", "", new { @id = "DateFrom", @style =  "width:190px" })%></div>
                <div id="CheckOut">Check-out:<br />
                <%:Html.TextBox("ToDate", "", new { @id = "DateTo", @style =  "width:190px" })%><br /></div>
                <div id="newView">  
                </div>
                <input type="submit" value="Search" />        
        </div>
               </div>
        <% } %>

试验
入住：

签出：

我的控制器代码

 public ActionResult Index(FormCollection post)
    {
        ITruckRepository hotelRep = new TruckRepository();

        IEnumerable<Truck> AvailableTrucks = hotelRep.getTrucks('2012,3,2', '2012,3,5');

       return PartialView("Search", AvailableTrucks );

    }

公共行动结果索引（FormCollection post）
{
ITruckRepository hotelRep=新卡车旅馆（）；
IEnumerable AvailableTrucks=hotelRep.getTrucks（'2012,3,2'，'2012,3,5'）；
返回PartialView（“搜索”，AvailableTracks）；
}

我是否通过Ajax将正确的参数传递给控制器

谢谢

您需要调用

formCollection

——它将表单编码为字符串以供提交

var formCollection = $('#some-form'); 
$(function(){ $('#some-form').submit(function(){ 
  $.ajax({ 
       type: "POST", 
       url: "/Trusk/Index", 
       data: formCollection.serialize(), 
       dataType: "html", 
       success: function (result) { 
           $('#newView').html(result); 
       }, 
       error: function (request, status, error) { 
           alert('Oh no!'); 
       } 
 }); 
});
});  

---

另外，虽然您的控制器方法上有一个

FormCollection

参数，但实际上并没有使用它？

您的代码有几个问题：

• 您使用了错误的Html.BeginForm方法重载。在您使用的重载中，

  id

  是路由值，而不是HTML属性
• 在.submit回调中，您没有通过返回false来取消默认操作，因此在提交表单时，在浏览器从页面重定向之前，AJAX调用几乎没有时间执行
• 在AJAX调用的数据参数中，当您应该序列化数据时，您正在传递一个jQuery对象，该对象表示名为

  formCollection

  的表单
• 您已经破坏了markup=>有一个结束div没有相应的开始元素

因此，让我们首先修复标记：

<% using (Html.BeginForm(null, null, FormMethod.Post, new { id = "some-form" })) { %>
    <div id="TestDiv">
        <div id="Title">Test</div>                 
        <div id="CheckIn">
            Check-in:<br />
            <%= Html.TextBox("FromDate", "", new { id = "DateFrom", style = "width:190px" }) %>
        </div>
        <div id="CheckOut">
            Check-out:<br />
            <%= Html.TextBox("ToDate", "", new { id = "DateTo", style = "width:190px" }) %>
            <br />
        </div>
        <div id="newView"></div>
        <input type="submit" value="Search" />        
    </div>
<% } %>

---

现在，您应该确保成功调用了相应的POST控制器操作，并且正确传递了参数。另外，请确保在渲染局部视图时，此控制器操作内部不会发生错误。使用诸如FireBug之类的javascript调试工具查看发送的请求/响应以及任何可能的js错误。

我将使用它，但仍然无法工作。出于某些原因，我的部分视图正在该URL上发布，而不是在newView id下的索引页上发布。这是否是添加表单id的方式，到表单？我已经让它有点工作了，尽管现在它向我展示了警惕（“哦，不”）救生员伙伴！这个问题已经解决了3个小时，你很快就解决了！非常感谢，伙计！发布URL 1有两种方法*@使用（Ajax.BeginForm（“Action”、“controller”、新的AjaxOptions{HttpMethod=“post”、OnSuccess=“AddEditOnsuccess（Data）”、OnBegin=“AddEditOnbegin”、OnFailure=“AddEditOnfail”}、新的{enctype=“multipart/form Data”、id=“frm”、@class=“apply nolazy”}）2。使用Ajax请求和do数据：$（this）.serialize（），

$(function () {
    $('#some-form').submit(function () {
        $.ajax({
            type: this.method,
            url: this.action,
            data: $(this).serialize(),
            success: function (result) {
                $('#newView').html(result);
            },
            error: function (request, status, error) {
                alert('Oh no!');
            }
        });
        return false;
    });
});