MVC3传递ViewModel到控制器方法使用JQuery Ajax

问题描述:

我想通过一个窗体的数据传递给我的控制器方法使用JQuery Ajax,但我不知道你是如何做到这一点,因为我的ViewModel为null当我使用调试器控制器端。MVC3传递ViewModel到控制器方法使用JQuery Ajax

我的视图模型为:

public class PremisesViewModel 
{ 

    public string createPremisesErrorMessage { get; set; } 
    public string updatePremisesErrorMessage { get; set; } 

    public SelectList listOfCounties = Initialise.countiesSelectList; 

    public Premise premises { get; set; } 
} 

凡处所是在我的数据库中的实体/表。

该表单包含Premises表中的字段。

在我的javascript函数我这样做:

var premisesViewModel = { 
           Id: 0, 
           PremisesDescription: $('#premises_PremisesDescription').val(), 
           OrdnanceSurveyReference: $('#premises_OrdnanceSurveyReference').val(), 
           PartRestrictedNotes: $('#premises_PartRestrictedNotes').val(), 
           NatureOfPremises: $('#premises_NatureOfPremises').val(), 
           AddressLine1: $('#premises_AddressLine1').val(), 
           AddressLine2: $('#premises_AddressLine2').val(), 
           Town: $('#premises_Town').val(), 
           CountyId: $('#premises_CountyId').val(), 
           Postcode: $('#premises_Postcode').val() 
          } 
    alert(form.serialize); 
    $.ajax({ 
     url: form.attr('action'), 
     type: 'POST', 
     dataType: "json", 
     contentType: 'application/json', 
     data: JSON.stringify(premisesViewModel), 
     success: function (data) { 
      alert('done'); 
     } 
    }) 

然而,当我检查视图模型参数在我的方法,它是空:

[HttpPost] 
    public JsonResult Create(PremisesViewModel pvm) 
    { 
     return null; 
    } 

如何映射这个所以任何想法视图模型绑定正确。 谢谢

+0

如果您使用萤火虫并查看发布请求,它会将正确的数据发送到创建页面吗? – 2012-03-26 11:40:04

您的JSON格式与您的模型类完全相同。

当前例如

public class PremisesViewModel 
{ 

    public string createPremisesErrorMessage { get; set; } 
    public string updatePremisesErrorMessage { get; set; } 

    public SelectList listOfCounties = Initialise.countiesSelectList; 

    public Premise premises { get; set; } 
} 

您的JSON像

var premisesViewModel = { 
            createPremisesErrorMessage : $('#premises_PremisesDescription').val(), 
            updatePremisesErrorMessage: $('#premises_OrdnanceSurveyReference').val(),  
            premises : {Define more properties here as per your Premise structure} 
           } 
+0

按照您的建议进行更改,并进行一些处理。感谢深入的代码,因为这使我对它更加清楚。 – user1079925 2012-03-26 12:05:02

您发布的数据中变量的名称与您的ASP.Net MVC ViewModel的属性名称不符,因此数据无法正确绑定。

如果你想自动构建从一种形式的束缚视图模型的模型,你可以使用代码从这个答案https://*.com/a/1186309到正确序列化为一个JSON对象。

然后您需要将它作为字符串传递给您的$ .ajax调用。总而言之,与您原来的非常相似。喜欢的东西:

var premisesViewModel = $('form').serializeObject(); 
$.ajax({ 
     url: form.attr('action'), 
     type: 'POST', 
     dataType: "json", 
     contentType: 'application/json', 
     data: JSON.stringify(premisesViewModel), 
     success: function (data) { 
      alert('done'); 
     } 
    }); 

很奇怪的是,没有核心功能转换为JSON对象,但你去那里。