Retrieve Json Data as a IEnumerable

Question

_{Tuesday, October 6, 2020 9:57 AM}

Goal:
Send a json data with many data from frontend to backend.

Problem:
When I send the data to the backend i do not retrieve it as a IEnumerable

What part of the code am I missing?

Info:
*Using JQuery as a frontend
*Using Asp.net mvc as a backend

Thank you!

@{
    ViewData["Title"] = "Home Page";
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>


<button class="testtest">
    dfdf
</button>

<script type="text/javascript">

    $('.testtest').click(function () {

        var txt = '{"name":"John", "age":30, "city":"New York"}'
        var obj = JSON.parse(txt);

        $.ajax({
            url: '@Url.Action("TestGet")',
            data:
            {
                contactcollection: obj
            },
            dataType: 'json',
            type: 'Get',
            contentType: 'application/json',
            success: function (result) {

                var display = '';


                return;
            }
        });

    });

</script>

using System;
using System.Collections.Generic;
using System.Diagnostics;
using System.Linq;
using System.Threading.Tasks;
using Microsoft.AspNetCore.Mvc;
using JsonData.Models;

namespace JsonData.Controllers
{
    public class HomeController : Controller
    {
        public IActionResult Index()
        {
            return View();
        }


        [HttpGet]
        public JsonResult TestGet(IEnumerable<Contact> contactcollection)
        {

            int ddd = 23;

            return Json(null);
        }
    }

    public class Contact
    {
        public string name;
        public int age;
        public string city;
    }
}

All replies (3)

_{Tuesday, October 6, 2020 12:48 PM}

sakuradata

Problem:
When I send the data to the backend i do not retrieve it as a IEnumerable

What part of the code am I missing?

There are several issues with the code; the model contains fields but should have properties, the JSON is not a collection, AJAX should POST JSON, and typically you have a JSON object that is serialized to a string. 

// GET: Ajax
[HttpGet]
public ActionResult Index()
{
    return View();
}

[HttpPost]
public ActionResult Index(IEnumerable<Contact> contactcollection)
{
    return Json(contactcollection);
}

<script>
    $('.testtest').click(function () {

        var data = [
            {
                name: "John",
                age: 30,
                city: "New York"
            }   
        ];
                
        var json = JSON.stringify(data);
        console.log(json);

        $.ajax({
            type: 'post',
            url: '@Url.Action("Index")',
            contentType: 'application/json',
            dataType: 'json',                    
            data: json,            
            success: function (result) {
                console.log(result);               
            }
        });

    });
</script>

---

_{Tuesday, October 6, 2020 2:27 PM}

In addition, IEnumerable is an interface, not a concrete class so the binder can not create an instance of it to bind to.

---

_{Wednesday, October 7, 2020 8:59 AM}

Hi,sakuradata

When I send the data to the backend i do not retrieve it as a IEnumerable

First,you should use [HttpPost] to get the parameters from view. Then if you want to get a list,  the data passed to the controller should be a list too, you can refer to my demo:

View:

<button class="testtest">
    dfdf
</button>

@section Scripts
{
    <script>
         $('.testtest').click(function () {
             var txt = '{"name":"John", "age":30, "city":"New York"}';
                    var obj = JSON.parse(txt);
                    var list = new Array();
                    list.push(obj);

             $.ajax({
                type: 'POST',
                url: "/Home/TestGet",
                data: { "contactcollection": list},
                success: function (result) {
                }
            });
    });
    </script>
}

Controller:

[HttpPost]
        public IActionResult TestGet(IEnumerable<Contact> contactcollection)
        {
            return Json(null);
        }

Result:

Best Regards,

Jerry Cai