asp.net-mvc-4 - How to Send Json String to Controller in mvc4 and Deserialize json

Question

I have the json object like below

Extension = {
"BookMarks":
[{"Name":"User1","Number":"101"},
{"Name":"User2","Number":"102"},
{"Name":"User3","Number":"103"}]}

I want to send this json string to my controller Action method and Deserialize the data

I want to pass the data to the partialview

 public ActionResult ExtensionsDialog(var data)
        {
            return PartialView(data); 
        }

Any help Thanks in advance..

Answer 1

在您的视图中：

function SendData(){
        var dataToSend = JSON.stringify(data);

        $.ajax({
            type: "POST",
            url: '@Url.Action("YourAction", "YourController")',
            dataType: "json",
            data: dataToSend,
            contentType: "application/json; charset=utf-8",

        });
}

$("#Updatebtn").click(function () {

             sendData(); 
});

在您的模型中：

public class YourModel
{
  public String Name { get; set; }
  public int Number { get; set; }
}

在您的控制器中：

[HttpPost]
public ActionResult YourAction()
        {
            var resolveRequest = HttpContext.Request;
            List<YourModel> model = new List<YourModel>();
            resolveRequest.InputStream.Seek(0, SeekOrigin.Begin);
            string jsonString = new StreamReader(resolveRequest.InputStream).ReadToEnd();
            if (jsonString != null)
            {
                JavaScriptSerializer serializer = new JavaScriptSerializer();
                model = (List<YourModel>)serializer.Deserialize(jsonString, typeof(List<YourModel>);
            }
          //Your operations..
         }

希望这可以帮助。

Answer 2

我认为您不必自己阅读输入流。如果您提供模型，则活页夹应该为您完成。

在您后面的代码中：

    public class StatusInfo
    {
        public int ItemId { get; set; }
        public int StatusId { get; set; }
    }

    [HttpPost]
    public ActionResult EditStatus(StatusInfo info)
    {
        DoSomethingInteresting(info.ItemId, info.StatusId);
        return new EmptyResult();           
    }

只需像这样使用 jQuery ajax 函数：

function changeStatus(itemId, statusId) {
    var postData = { "ItemId": itemId, "StatusId": statusId };
    $.ajax({
        url: "/Item/EditStatus",
        type: "POST",
        data: JSON.stringify(postData),
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (data, status) {
            console.log("success updating status.");
        },
        error: function () {
            console.log("error updating status.");
        }
    });
}

Answer 3

您可以像这样通过 ajax 调用传递数据：

$.ajax({
  url         :    "@Url.Action("YourMethod", "YourController")",
  contentType :    "application/json; charset=utf-8",
  dataType    :    "json",
  type        :    "POST",
  data        :    JSON.stringify({Extension: data})
}).done(function (result) {
  //Check if it's OK
}).fail(function (result) {
  //Check if it is not OK
}).always(function() {
  //Some code executed whatever success or fail
})

.done，.fail并且.always不是强制性的，我认为这更好。

然后像你一样在你的控制器中使用它。应该没问题。

Answer 4

您可以像这样调用操作并传递值。只需将您的数据替换为我在数据部分中的数据即可。

$.ajax({
                url: '/Schedule/Schedule/Create',
                type: 'POST',
                cache: false,
                datatype: JSON,
                data: {

                scheduleName: ScheduleName,
                description: Desc,
                Hol_Type: JSON.stringify(holidaytype),
                Start_Date: start_date,
                End_Date: end_date,
                Start_Time: StartTime,
                End_Time: EndTime,
                days: JSON.stringify(days),
                rec_type:1

            },
            success: function (data, status) {}});

Answer 5

你的脚本应该是这样的：

Extension = {"BookMarks":[{"Name":"User1","Number":"101"},{"Name":"User2","Number":"102"},{"Name":"User3","Number":"103"}]}
    $.ajax({
    url         :    "@Url.Action("ExtensionsDialog", "Controller")",
    contentType :    "application/json; charset=utf-8",
    dataType    :    "json",
    type        :    "POST",
    data        :      {"data" : Extension }
 });

动作方法相同。

 public ActionResult ExtensionsDialog(var data)
    {
        return PartialView(data); 
    }