C＃MVC4-将自定义类的列表传递回Javascript

Question

In my controller, I have the following method.. pretty straight forward.

namespace Playground.Controllers
{
    public class TasksController : Controller
    {

        // an ajax call to this generates the server error in the response
        // "Value cannot be null. Parameter name: controllerContext"
        [HttpGet]
        public JsonResult GetTask()
        {
            List<Task> tasks = GetTasks();
            return Json(tasks, JsonRequestBehavior.AllowGet);
        }

        // an ajax call to this comes back successful, but only outputs
        // "System.Collections.Generic.List`1[Playground.Models.Task]"
        // which, when expanded... is empty
        [HttpGet]
        public List<Task> GetTasks()
        {
            //Create an array to hold all of the task objects
            var tasks = new List<Task> { };

            //Execute the select statement and get back a SqlDataReader object
            DataTable table = DataAccess.ExecuteSelect("select Id, Name, Description, Starting, Ending from Tasks");

            foreach (DataRow dr in table.Rows)
            {
                //Assign values to the task object
                Task task = new Task((int)dr["Id"],
                                  (string)dr["Name"],
                                  (string)dr["Description"],
                                  (DateTime)dr["Starting"],
                                  (DateTime)dr["Ending"]);

                //Add task object to list of task objects
                tasks.Add(task);
            }

            return tasks;
        }

    }
}

Which creates an object of type Task. Class shown here

namespace Playground.Models
{
    public class Task : Controller
    {
        public int Id { get; set; }
        public string Name { get; set; }
        public string Description { get; set; }
        public DateTime Starting { get; set; }
        public DateTime Ending { get; set; }

        public Task(int Id, string Name, string Description, DateTime Starting, DateTime Ending)
        {
            this.Id = Id;
            this.Name = Name;
            this.Description = Description;
            this.Starting = Starting;
            this.Ending = Ending;
        }
    }
}

I have an Ajax call to that method.

$.ajax({

    type: "GET",
    url: "Tasks/GetTasks",   //Changed between GetTasks and GetTask for testing.
    dataType: "html",
  //dataType: "json",
    async: false,
    data: { },
    success: function (data, text) {

        console.dir(data);
        console.dir(text);

    },
    error: function (request, status, error) {
        //do something
    }

});

The output from the two console.dir() lines:

    System.Collections.Generic.List`1[Playground.Models.Task]
          No Properties
          Tasks.js:12
    success
          No Properties
          Tasks.js:13

How do I get back a Javascript object where I can loop through each "Task" in the array... to output the "Id", "Name" (etc) as desired?

I've tried various combinations in C# to convert my List of Tasks with no success

    //Error on the Serialize line
    // "Exception has been thrown by the target of an invocation."
    public JsonResult GetTask()
    {
        List<Task> tasks = GetTasks(); 
        JavaScriptSerializer ser = new JavaScriptSerializer();
        object obj = tasks;
        var val = ser.Serialize(obj);
        return Json(val, JsonRequestBehavior.AllowGet);
    }

    --- AND ---

    //Returns a server error to JS
    //Value cannot be null. Parameter name: controllerContext
    public JsonResult GetTask()
    {
        List<Task> tasks = GetTasks();
        JsonResult jr = new JsonResult();
        jr.Data = Json(tasks);
        jr.JsonRequestBehavior = JsonRequestBehavior.AllowGet;
        return jr;
    }

    --- AND ---

    //Returns a server error to JS
    //Value cannot be null. Parameter name: controllerContext
    public JsonResult GetTask()
    {
        List<Task> tasks = GetTasks();
        return Json(tasks, JsonRequestBehavior.AllowGet);   
    }

    --- AND ---

    //Returns a server error to JS
    //Value cannot be null. Parameter name: controllerContext
    [HttpGet]
    public JsonResult GetTask()
    {
        Task task = new Task(0, "Name", "Desc", new DateTime(), new DateTime());
        return Json(task, JsonRequestBehavior.AllowGet);
    }

Answer 1

You're requesting HTML not JSON so it's converting the return value to a string instead of JSONifying it. Change your dataType to json .

Edit

I'm assuming that you're deriving from ApiController not Controller . Based on your comment, that may not be the case. Depending on whether you're developing an API or just adding an action that returns JSON to a standard controller, what I'd recommend is different. If you're developing an API, then you should derive from ApiController and then the content type will determine the format of the result. If you're just extending a standard controller with a method that returns JSON, then you'll want to return a JsonResult. In the latter case you'll need to both request json and update your action to:

[HttpGet]
public JsonResult GetTasks()
{
    //Create an array to hold all of the task objects
    var tasks = new List<Task> { };

    //Execute the select statement and get back a SqlDataReader object
    DataTable table = DataAccess.ExecuteSelect("select Id, Name, Description, Starting, Ending from Tasks");

    foreach (DataRow dr in table.Rows)
    {
        //Assign values to the task object
        Task task = new Task((int)dr["Id"],
                            (string)dr["Name"],
                            (string)dr["Description"],
                            (DateTime)dr["Starting"],
                            (DateTime)dr["Ending"]);

        //Add task object to list of task objects
        tasks.Add(task);
    }

    return Json(tasks, JsonRequestBehavior.AllowGet);
}