How to Append a Model to FormData and Receive it as a Model in an MVC Controller?

Add the model to FormData in the MVC and receive it as a model

This article provides a complete solution to solve the common problems that transmit the complete model set through FormData and use it as a model access in the controller.

The traditional method is to add the model object as a string to the FormData, which will cause the Request.form set in the controller to receive the "[Object Object]". In order to overcome this limit, a better method can be used:

Use FormData () serialized model

Using FormData () function, the model can be effectively serialized into FormData. This will automatically include files uploaded uploaded through the HTML form.

Use Ajax to release data

var formdata = new FormData($('form').get(0));

To publish the serialized model data to the controller, please use the following AJAX request:

Receive the model in the controller

$.ajax({
  url: '@Url.Action("YourActionName", "YourControllerName")',
  type: 'POST',
  data: formdata,
  processData: false,
  contentType: false,         
});

In the controller, you can receive serialized model data through a strong type model parameter:

or, if your model does not include httppostedFilebase, consider the following modification:

[HttpPost]
public ActionResult YourActionName(YourModelType model)
{
}

Including additional attributes

[HttpPost]
public ActionResult YourActionName(YourModelType model, HttpPostedFileBase myImage)
{
}

If you need to include other information other than the content of the form, you can use the following grammar to effectively add attributes:

Through these technologies, you can seamlessly add model data to FormData, so that it is convenient to transmit it as a model type in the operation method of the controller.

formdata.append('someProperty', 'SomeValue');

The above is the detailed content of How to Append a Model to FormData and Receive it as a Model in an MVC Controller?. For more information, please follow other related articles on the PHP Chinese website!