web-dev-qa-db-ja.com

パラメータとしてViewModelを使用するmvcコントローラにjquery.postのデータを送信するにはどうすればよいですか?

私はasp.net mvcでアプリケーションを書いています。いくつかのViewModelをパラメーターとして使用するアクションを持つコントローラーがあります。 jquery postでフォームデータをそのmvcコントローラーに送信する方法。

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

});

渡しているViewModelプロパティ名とパラメーターは同じでなければなりません。すなわち:あなたのビューモデルは、彼のようなFirstNameLastNameと呼ばれる2つのプロパティを持っている必要があります

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に強く型付けされている場合、jQuery serializeメソッドを使用して、シリアル化されたフォームをアクションメソッドに単に送信できます。

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

});

編集:コメント通り

SerializeもChildプロパティを処理します。このような職業と呼ばれるクラスがあると仮定します

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メソッドでこれらのデータを取得します。

enter image description here

39
Shyju
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;
}

フォーム全体をシリアル化し、コントローラーのアクションメソッドに渡すこともできます。あなたのajaxコールで:

data: $('form').serialize()
9
Kamyar