如何将jquery.post中的数据发送到使用ViewModel作为参数的mvc控制器?

2021/01/12 10:11 · jquery ·  · 0评论

我正在用asp.net mvc编写应用程序。我有带动作的控制器,它使用一些ViewModel作为参数。如何使用jquery post将表单数据发送到该mvc控制器。

$.post("Yourcontroller/YourAction", { FirstName : $("#txtFirstName").val(), LastName : $("#txtLastName") } ,function(data){
  //do whatever with the response

});

您传递的ViewModel属性名称和参数应该相同。即:您的视图模型应该有2个属性叫FirstNameLastName喜欢他

public class PersonViewModel
{
  public string FirstName { set;get;}
  public string LastName { set;get;}
  // other properties

}

并且您的Post操作方法应接受类型的参数 PersonViewModel

[HttpPost]
public ActionResult YourAction(PersonViewModel model)
{
  //Now check model.FirstName 
}

或者,如果您的视图被强类型化为PersonViewModel,则可以简单地使用jQueryserialize方法将序列化表格发送到action方法。

$.post("Yourcontroller/YourAction", $("#formId").serialize() ,function(data){
  //do whatever with the response

});

编辑:根据评论

Serialize也将照顾儿童财产。假设您有一个像这样的职业课程

public class Profession
{
    public string ProfessionName { set; get; }
}

并且您的PersonViewModel具有类型的属性 Profession

public class PersonViewModel
{
    //other properties
    public Profession Profession { set; get; }
    public PersonViewModel()
    {
        if (Profession == null)
            Profession = new Profession();
    }
}

如果从视图中填充数据,则将在HttpPost Action方法中获得这些数据。

在此处输入图片说明

var myData = {
              Parameter1: $("#someElementId").val(),
              Parameter2: $("#anotherElementId").val(),
              ListParameter: { /* Define IEnumerable collections as json array as well */}
              // more params here
             }  
$.ajax({
    url: 'someUrl',
    type: 'POST',
    dataType: "json",
    contentType: 'application/json',
    data: JSON.stringify(myData)
});  


[HttpPost]
public JsonResult Create(CustomViewModel vm)
{
    // You can access your ViewModel like a non-ajax call here.
    var passedValue = vm.Parameter1;
}

您还可以序列化整个表单,并将其传递给控制器​​的action方法。在您的ajax呼叫中:

data: $('form').serialize()
本文地址:http://jquery.askforanswer.com/ruhejiangjquery-postzhongdeshujufasongdaoshiyongviewmodelzuoweicanshudemvckongzhiqi.html
文章标签: ,   ,   ,  
版权声明:本文为原创文章,版权归 admin 所有,欢迎分享本文,转载请保留出处!

文件下载

老薛主机终身7折优惠码boke112

上一篇:
下一篇:

评论已关闭!