KO.Utils.PostJSon 在控制器 MVC 4 中返回 Null答案

【问题标题】：KO.Utils.PostJSon returns Null in Controller MVC 4KO.Utils.PostJSon 在控制器 MVC 4 中返回 Null
【发布时间】：2014-03-21 07:09:58
【问题描述】：

我正在尝试使用 knockout.js 创建一个网格，方法如下 http://blog.stevensanderson.com/2010/07/12/editing-a-variable-length-list-knockout-style/

当我尝试将值从 viwe 发布到控制器时，我总是得到一个 count=0 值。但是当我尝试使用警报检查数据是否具有视图模型时。它按预期出现。有没有人面临/修复了这个问题。请突出显示错误所在。

她是我的模特。

public class GiftModel
{
    public string Title { get; set; }
    public string Price { get; set; }
}

控制器中的代码：

         public ActionResult Index()
    {
        var initialState = new[] {
    new GiftModel { Title = "Head First C#", Price = "49.95" },
    new GiftModel { Title = "Head First Js", Price = "78.25" }
        };
        return View(initialState);
    }

    [HttpPost]
    public ActionResult Index(IEnumerable<GiftModel> gifts)
    {
        return View();
    }

这是我在做的事情。

var initialData = @Html.Raw(new System.Web.Script.Serialization.JavaScriptSerializer().Serialize(Model));

var viewModel = { 
    gifts : ko.observableArray(initialData), 

    addGift: function () { 
        this.gifts.push({ Title: "", Price: "" }); 
    },

    removeGift: function (gift) { 
        this.gifts.remove(gift); 
    },

    save: function() { 
        var data = ko.toJSON(this.gifts);
        alert(data);
        ko.utils.postJson(location.href, { gifts: data });
    }
}; 

ko.applyBindings(viewModel,document.body);

我也尝试过使用普通的 Ajax 帖子。但我仍然得到同样的结果。

编辑：这是我收到的警报

[{"Title":"Head First C#","Price":"49.95"},{"Title":"Head First Js","Price":"78.25"}]

更新：如果我直接通过弹出内容控制器可以识别数据。

        var model = [{"Title":"Head First C#","Price":"49.95"},{"Title":"Head First Js","Price":"78.25"}];"Status": "Reserved" }];
        $.ajax({
            url: '/Grid/Index',
            type: 'POST',
            contentType: 'application/json; charset=utf-8',
            data: JSON.stringify(model),
            success: function (result) {

            }
        });

【问题讨论】：

无需致电ko.toJSON()。在内部，ko.utils.postJson() 为您完成。
是的，我已经开始这样做了，但没有给我输出然后我已经转移到 Ajax Calls。谢谢@haim770
试试ko.utils.postJson(location.href, this.gifts);。

标签： jquery asp.net-mvc-4 knockout.js knockout-mvc

【解决方案1】：

尝试使用ko.toJS 而不是ko.toJSON。

更新：
试试这个（而不是ko.utils.postJson）：

$.ajax({
        url: <your_url>,
        type: 'POST',
        contentType: "application/json",
        data: JSON.stringify(data)
    });

【讨论】：

这里发生了一些奇怪的事情。如果我像下面这样直接传递从警报中收到的内容。它可以识别数据。我已经用它更新了问题。
这真的很有趣...你可以尝试创建一个空数组，而不是用你的数据填充它并发送这个数组。
让我们continue this discussion in chat

【解决方案2】：

我只想问：你有模型：

public class GiftModel
{
    public string Title { get; set; }
    public double Price { get; set; }
}

为什么你在价格是双倍的时候推入价格字符串？

new GiftModel {/**/, Price = "78.25" }

在您提供的链接中，这一行看起来：

new GiftModel { /**/, Price = 78.25 }

我并不是说这将有助于解决您的问题。我只是好奇。

@更新

在这个网页上：KnockOutJS Homepage 你可以找到这一行：

// To actually transmit to server as a regular form post, write this: 
ko.utils.postJson($("form")[0], self.gifts);

不使用任何 ko.toJSON(data); 所以在你的情况下，这将是：

ko.utils.postJson(youradress,this.gifts)

检查一下:)

【讨论】：

我很抱歉，最初我有那个模型，然后在经历了所有选项之后，我不知道该怎么做（:-.going DUMB），我只是将 double 更改为 string。所以我改变了那个.对不起，我没有在问题中更新
感谢 szpic。我已经尝试了所有选项，我的计数为零。我在哪里做错了。

【解决方案3】：

终于，我做到了。

在将数据发送到请求之前，我们需要调用ko.toJS(this.gifts)。

这是工作代码。

var initialData = @Html.Raw(Json.Encode(Model));

var viewModel = { 
    gifts : ko.observableArray(initialData), 

    addGift: function () { 
        this.gifts.push({ Title: "", Price: "" }); 
    },

    removeGift: function (gift) {
        this.gifts.remove(gift);
    },

    Save : function () {

        var ViewModel = ko.toJS(this.gifts);


        $.ajax({
            type: "POST",
            url: "/Grid/Index",
            data: ko.toJSON(ViewModel),
            contentType: 'application/json',
            async: true,
            complete: function () {
                alert('success');
            },
            error: function (jqXHR, textStatus, errorThrown) {
                alert('Error');
            }
        });
    }
};

感谢 Ivan.Srb,szpic。

【讨论】：