how to send generic list with json

Question

I have generic list to view.

List<Student> StudentList = ViewBag.StudentList;

I want send this list with JSON.

var listSTD = @StudentList;
var id = 5;
    $.ajax({
        url: "/Students/Check",
        type: "POST",
        dataType: 'json',
        data: {"listSTD": listSTD, "id": id},
        contentType: "application/json; charset=utf-8",
        success: function(result) {
            alert(result.Result);
        }
    });

but is not working. get error in this code:

var listSTD = @StudentList;

= @StudentList; is clearly invalid. The view has access to the model, the Temp dictionary and the ViewBag. If you want to access something from the ViewBag use the same syntax you use in C#, eg @ViewBag.StudentList. Everything after that @ is C# code — Panagiotis Kanavos
– Panagiotis Kanavos, Commented Dec 4, 2019 at 13:11

kyleruss · Accepted Answer · 2019-12-04 13:22:40Z

1

You shouldn't be passing the List<Student object directly to your script as the object is not in a format js can read or work with so you need to JSON serialize the object into a JSON string which you can then include in the data body of your post request.

You can serialize the object with Newtonsoft.Json and you need to make sure the listSTD variable is instantiated inline when the view is rendered rather than in an external file (the rest of your code can be in an external js file). For example:

<html>
  <body>
    @{ List<Student> StudentList = ViewBag.StudentList; }

    <script>
       var listSTD = "@JsonConvert.SerializeObject(StudentList)";
    </script>
  </body>
<html>

On the server-side controller action responding to your post request at /Students/Check you can de-serialize the posted student list JSON back into List<Student> For example in your controller action:

public class StudentsController
{
  public ActionResult Check(StudentsCheckViewModel model)
  {
     int id = model.id;
     List<Student> Students = Json.DeserializeObject<List<Student>>(model.listSTD);
  }
}

And the view model:

public class StudentsCheckViewModel 
{
   public int id { get; set; }

   public string listSTD { get; set; }
}

edited Dec 4, 2019 at 13:22

answered Dec 4, 2019 at 12:37

kyleruss

4973 silver badges9 bronze badges

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

7 Comments

mishi caro Over a year ago

What is the json action input with this code? i using this but send null list in action.

Panagiotis Kanavos Over a year ago

@mishicaro you didn't ask anything about actions. You asked how to emit a JSON array into the view

kyleruss Over a year ago

Do you have Newtonsoft.Json? If not, the resulting serialized JSON string will probably null or error. Install in nuget by: Install-Package Newtonsoft.Json

mishi caro Over a year ago

I want use this list in input action in /Students/Check.

mishi caro Over a year ago

not error in code. but send or give empty null list. i use List<Student> type in input json action in "/Students/Check" address

|

Panagiotis Kanavos · Accepted Answer · 2019-12-04 12:54:33Z

0

You can serialize the data as JSON into the view using the JSON helper, eg :

<script type="text/javascript" charset="utf-8">

    var rowData = @Json.Serialize(Model.Rows);
    ...

</script>

In older versions you may have to use Json.Encode or wrap the call in Html.Raw, eg @Html.Raw(Json.Serialize(...))

answered Dec 4, 2019 at 12:54

Panagiotis Kanavos

134k16 gold badges211 silver badges271 bronze badges

3 Comments

mishi caro Over a year ago

I do not have Serialize method. and use Encode but not working...

Panagiotis Kanavos Over a year ago

@mishicaro I copied that code from my own project. Which ASP.NET MVC version are you using and what does not working mean? What do you see in the page source?

Panagiotis Kanavos Over a year ago

@mishicaro ASP.NET MVC 6 does have Json.Serialize as shown in this possibly duplicate question

Collectives™ on Stack Overflow

how to send generic list with json

2 Answers 2

7 Comments

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

7 Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related