Passing data from ajax to asp.net core

Question

I am trying to pass object from ajax to asp.net core

Here is asp code

[HttpPost]
public async Task<IActionResult> AddOrUpdate([FromForm] LSPost lsPost, List<IFormFile> files)
{
    return await Task.Run<IActionResult>(() =>
    {
        try
        {
            JsonResult t = ImageUpload(files).Result as JsonResult;
            string[] fullFilePathsReturned = t.Value as string[];

            lsPost.Media = fullFilePathsReturned[0];
            lsPost.Update();
            return Ok();
        }
        catch (Exception ex)
        {
            return StatusCode(500);
        }
    });
}

and here is ajax call

function UploadFile() {
    var lsPost = @Html.Raw(Newtonsoft.Json.JsonConvert.SerializeObject(new LSPost()));

    lsPost.Title = $("#someText").val();

    console.log(lsPost);

    var fileData = new FormData();
    fileData.append("lsPost", lsPost);
    fileData.append("files", $("#someRandomID").get(0).files[0]);

    $.ajax({
        type: "POST",
        url: "/LSPostModel/AddOrUpdate",
        processData: false,
        contentType: false,
        data: fileData,
        success: function () {
        }
    });
}

parameter "files" is passed but "lsPost" is not. I tried adding / removing [FromForm] / [FromBody] tags. I tried matching first parameter of fileData.append with parameter name on back. I tried matching javascript object name with parameter name on back. Nothing is working....

You may need to swap List<IFormFile> files to IFormFile[] files as sometimes C# can't deserialize to List. — Zze
– Zze, Commented Dec 8, 2020 at 1:16
Does this answer your question? Upload files and JSON in ASP.NET Core Web API. The only extra change I would make is fileData.append("lsPost", JSON.stringify(lsPost)) — Phil
– Phil, Commented Dec 8, 2020 at 1:26

Karney. · Accepted Answer · 2020-12-08 02:30:02Z

0

If you want to use ·formdata· to map multiple parameters at the same time. Please use simple types. For example, change the data in formdata to a basic type value. Change the parameter of action to string.

//ajax
fileData.append("lsPost", lsPost.Title);

//action
[HttpPost]
public async Task<IActionResult> AddOrUpdate([FromForm] string lsPost, List<IFormFile> files)
    {
     //...

The another solution, you can also put List<IFormFile> into LSPost. For example:

//ajax
fileData.append("Title", lsPost.Title);

//action
[HttpPost]
public async Task<IActionResult> AddOrUpdate([FromForm] LSPost lsPost)
    {
     //...

Model

public class LSPost
{
    public string Title { get; set; }
    public List<IFormFile> files { get; set; }
}

Note: An item of formdata cannot map the complex object type of the backend.

edited Dec 8, 2020 at 2:30

answered Dec 8, 2020 at 2:13

Karney.

5,0812 gold badges10 silver badges11 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Passing data from ajax to asp.net core

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related