如何在MVC中使用JQUERY AJAX将viewmodel发布到action方法

我想使用$ .POST或$ .AJAX实现create（INSERT）屏幕。

注意：代码工作正常，没有AJAX调用..已经存在..现在我需要做ajax调用并保存而不回发。 我在下面写了代码：

提交点击事件以下是代码：

$.ajax( { url: '@Url.Action("CreateProduct","ProductManagement")', dataType: 'json', contentType: 'application/json; charset=utf-8', type: 'post', data: $('frm').serialize(), success: function () { alert('s'); }, error: function (e1, e2, e3) { alert(e2); alert(e1 + ' ' + e2 + ' ' + e3); alert('failure event'); } } ); }); 

在服务器端：

 [HttpPost] public JsonResult CreateProduct(FormCollection frm) { manager.ProductManager m = new manager.ProductManager(); // m.InsertProduct(new common.DTO.ProductDTO() { Id = id, ProductName = ProductName, Description = Description, Cost = cost, ProductTypeId = 5 }); return Json("'result':'success'", JsonRequestBehavior.AllowGet); } 

问题是，每次调用动作但没有在frm参数参数上找到数据。 我也试图保持 – 查看模型ProductViewModel vm作为参数，但它没有工作..只是给我空值。 而且，在ajax电话中，它取得了成功但是。 只是问题在控制器的动作上没有发布。

Html如下：

  @using (Html.BeginForm("CreateProduct", "ProductManagement", FormMethod.Post, new { id = "frm" })) { @Html.AntiForgeryToken() @Html.ValidationSummary(true) 
 
ProductViewModel
 
 
 @Html.LabelFor(model => model.ProductName) 
 
 @Html.EditorFor(model => model.ProductName) @Html.ValidationMessageFor(model => model.ProductName) 
 
 @Html.LabelFor(model => model.Cost) 
 
 @Html.EditorFor(model => model.Cost) @Html.ValidationMessageFor(model => model.Cost) 
 
 @Html.LabelFor(model => model.Description) 
 
 @Html.EditorFor(model => model.Description) @Html.ValidationMessageFor(model => model.Description) 
 
 @Html.LabelFor(model => model.ProductTypeId) 
 
 @Html.DropDownList("ProductTypeId", "Choose item") @Html.ValidationMessageFor(model => model.ProductTypeId) 
 
 @Html.LabelFor(model => model.ProductTypeName) 
 
 @Html.EditorFor(model => model.ProductTypeName) @Html.ValidationMessageFor(model => model.ProductTypeName) 
 
 
  
 
 } 
 @Html.ActionLink("Back to List", "Index")  

请指导我这里有什么问题。

谢谢

Answer 1

对于id Selector，您必须使用带有id的“＃”。

这将有效：

 $.ajax( { url: '@Url.Action("CreateProduct","ProductManagement")', dataType: 'json', contentType: 'application/json; charset=utf-8', type: 'post', data: $('this').serialize(), OR $('#frm').serialize(), <----------------- success: function () { alert('s'); }, error: function (e1, e2, e3) { alert(e2); alert(e1 + ' ' + e2 + ' ' + e3); alert('failure event'); } } ); 

或试试这个：

 var form = $('#frm'); $.ajax({ cache: false, async: true, dataType: 'json', contentType: 'application/json; charset=utf-8', type: "POST", url: form.attr('action'), data: form.serialize(), success: function (data) { alert(data); } }); 

Answer 2

你忘了添加id selecter：

 $.ajax( { url: '@Url.Action("CreateProduct","ProductManagement")', dataType: 'json', contentType: 'application/json; charset=utf-8', type: 'post', data: $('#frm').serialize(), // $('#frm'); success: function () { alert('s'); }, error: function (e1, e2, e3) { alert(e2); alert(e1 + ' ' + e2 + ' ' + e3); alert('failure event'); } } ); 

Answer 3

如果表单的id是frm ，那么它应该如下引用

 data: $("#frm").serialize(),