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

时间:2013-03-20 15:05:57

标签: asp.net-mvc knockout.js

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

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

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

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

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和参数Δ

1 个答案:

答案 0 :(得分: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请求数据...... Else ....

我遵循这样的方法: -

MODEL: -

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; }

    }
}

CONTROLLER

        //
        // 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) {

            });