如何将 knockoutjs 视图模型传递给 mvc 控制器答案

【问题标题】：how to pass knockoutjs view model into a mvc controller如何将 knockoutjs 视图模型传递给 mvc 控制器
【发布时间】：2013-03-21 03:50:08
【问题描述】：

我在 MVC 控制器中有以下功能

public class XyzController:Controller
{
    public ActionResult Index(){...}
    [HttpPost]
    public bool Save(string jsondata)
    {

        //parse json data to insert into the database
    }
}

我想将此视图模型传递给保存函数

var myObj = function (id) {
    var self = this;
    self.myId = id;    
    self.parameters = ko.observableArray();    
}

var ViewModel = function () {
    var self = this;       
    self.myObjList = ko.observableArray();
    self.sendItems = function() {
             $.ajax({
                     type: "POST",
                     url: '/Xyz/Save',
                     data: ko.toJSON(self),
                     contentType: "application/json; charset=utf-8",
                     dataType: "json",
                     success: function (response) {
                             alert(response);
                     },
                     error: function (request, status, error) {
                            alert(request.statusText);
                     }
             });
    }
}

var vm = new ViewModel()
ko.applyBindings(vm);

如果我将数据作为 JSON.stringify({jsondata:ko.toJSON(self)}) 传递，我确实得到了数据，但是我如何将它转换为一个对象，以便我可以遍历 myObjList 和参数？

【问题讨论】：

只要让 action 方法接受你的对象的任何类型的对象。让模型绑定器完成工作。
完全同意 Andrew 的观点：您正在绕过 MVC 的固有能力之一。更改您的签名以接收目标对象类型并让 MVC 为您进行映射。

标签： asp.net-mvc knockout.js

【解决方案1】：

首先尝试将您的模型更改为这样的：-

[JsonObject(MemberSerialization.OptIn)]
    public class Test
    {

        [JsonProperty("myId")]
        public string Id { get; set; }

        [JsonProperty("parameters")]
        public List<string> Parameters { get; set; }//List<string> or whatever it takes int of string

    }

如果不起作用，请发布您的 Ajax 请求数据...否则....

我遵循这样的方法：-

型号：-

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using Newtonsoft.Json;

namespace MvcApplication4.Models
{
    [JsonObject(MemberSerialization.OptIn)]
    public class Test
    {

        [JsonProperty("id")]
        public string Id { get; set; }

        [JsonProperty("name")]
        public string Name { get; set; }

    }
}

控制器

        //
        // POST: /Testing/
        [HttpPost]
        public void Post(MvcApplication4.Models.Test request)
        {

            try
            {
                //DO YOUR STUFF
            }
            catch (Exception ex)
            {
                throw (ex);
            }

        }

AJAX 调用：-

var json = {};
json = data.id;
json = data.name;

$.ajax({
            type:  "POST",
            url: ""//Your URL,
            dataType: "json",
            contentType: 'application/json; charset=utf-8',
            data: ko.toJSON(json)
        }).done(function (data) {

        }).fail(function (request, error) {

        });

或者像这样进行 AJAX 调用

$.ajax({
                type:  "POST",
                url: ""//Your URL,
                dataType: "json",
                contentType: 'application/json; charset=utf-8',
                data: ko.toJSON({ id: value1, name: value2 }),//Get value1 and value2 from you ko varables
            }).done(function (data) {

            }).fail(function (request, error) {

            });

【讨论】：