1

I am sending formdata data object to mvc controller. I received the array in controller but the object is always missing. Searched a lot about it did not find a clue.

I have tried to send whole object or appending each value to formdata but its always null. does formdata accepts? nested object.

My jQuery code:

 function addstudent() {
       var form= $("#studentform").valid();
        if (form)
        {

            personfood.details.firstname = $("#firstname").val();
            personfood.details.lastname = $("#lastname").val();
            personfood.details.imageuploaded = $("#imageupload")[0].files[0];
            personfood.details.rememberme = $("#rememberme").is(":checked");
            personfood.details.newsletter = $("#newsletter").is(":checked");
            personfood.details.gender = $("input[name='gender']").val();

            var personfoods = new FormData();

            $.each(personfood.details, function (key, value) {
                personfoods.append(key, value);
            });
            $.each(personfood.foodname, function (key, value) {
                personfoods.append("foodname["+[key]+"]", value);

            });

            for (var pair of personfoods.entries()) {
                console.log(pair[0] + ', ' + pair[1]);
            }

            $.ajax({
                url: "/Main/addperson",
                type: "POST",
                processData: false,
                cache: false,
                contentType: false,
                dataType: "json",
                data: personfoods,
                success: onsucessinsert,
                error:onerrorinsert
            })

        }

My ViewModel

 public class personfoods
 {
    public details details { get; set; }
    public List<string> foodname { get; set; }
 }

details model:

public class details
{
    public int id { get; set; }
    public string firstname { get; set; }
    public string lastname { get; set; }
    public string imagename { get; set; }
    public string imageshorturl { get; set; }
    public string imagefullurl { get; set; }
    public bool rememberme {get;set;}
    public bool newsletter { get; set; } 
    public string gender { get; set;}
    public HttpPostedFileBase imageuploaded { get; set; }
}
TanvirArjel
  • 30,049
  • 14
  • 78
  • 114
ahmedshah
  • 51
  • 1
  • 9
  • Have you tried with `data:JSON.stringify(personfoods);`? – TanvirArjel Jan 19 '19 at 11:06
  • yah tried data:JSON.stringify(personfoods); and data:JSON.stringify(personfoods.details); – ahmedshah Jan 19 '19 at 11:12
  • Can you share your screen please? – TanvirArjel Jan 19 '19 at 11:13
  • @TanvirArjel i am inspecting it in controller i can see an array of foodname but details object is always null?it seems like i cant append a object formdata? – ahmedshah Jan 19 '19 at 11:26
  • Yeh! You are missing something here! Need to debug. – TanvirArjel Jan 19 '19 at 11:27
  • yah i will see my headers look like that 'details: {"details":{"firstname":"khan","lastname":"saab","imageuploaded":{},"rememberme":true,"newsletter":true,"gender":"male"},"foodname":["Burger","Prawn","Fish"]} foodname[0]: Burger foodname[1]: Prawn foodname[2]: Fish' – ahmedshah Jan 19 '19 at 11:29
  • @ahmedshah refer this link, this might be help full "https://stackoverflow.com/questions/15350903/how-to-use-model-binding-with-jquery" – Jilani pasha Jan 19 '19 at 12:06
  • Follow this question, it solves the problem [enter link description here](https://stackoverflow.com/a/49471824/9611273) – Đức Huỳnh Dec 26 '20 at 06:22

2 Answers2

1

i solve it using $.each and appending key value pairs to my formdata.

$.each(personfood.details, function (key, value) {
                personfoods.append("details[" + key + "]",value);
            });
ahmedshah
  • 51
  • 1
  • 9
-1

ContentType should be ''application/json; charset=utf-8" and you can not post files like you are doing. I think data:JSON.stringify(personfoods); should work for remaining properties.

Gaurav
  • 782
  • 5
  • 12