淘汰赛。js viewmodel不绑定在asp.net mvc控制器中

时间:2022-12-03 07:53:21

I am using a simple example to post the knockout's viewmodel to the controller. but it is not happening. the dog method at the controller is getting null.

我正在使用一个简单的示例将knockout的viewmodel发布到控制器。但这并没有发生。控制器的dog方法将获得null。

What I am doing wrong?

我做错了什么?

My Model

我的模型

public class Dog
{
    public string name { get; set; }
    public int age { get; set; }
}

my controller in which the Dog object is getting null

我的控制器,其中狗的对象是null。

[HttpPost]
public ActionResult Save(Dog dog)
{
    return Json(new { Status = string.Format("Success, saved {0} with age: {1}", dog.name, dog.age) });
}

View

视图

<form method="POST" data-bind="submit: save">
    <div>Name:</div>
    <div><input type="text" data-bind="value: name" /></div>

    <div>Age:</div>
    <div><input type="text" data-bind="value: age" /></div>

    <div><input type="submit" value="Save" /></div>
</form>


 var ViewModel = function (data) {
    var self = this;
    ko.mapping.fromJS(data, {}, self);

    //self.isValid = ko.computed(function () {
    //    return self.name().length > 0;
    //});

    self.save = function () {
        $.ajax({
            url: "Home/Save",
            type: "post",
            contentType: "application/json",
            data: ko.mapping.toJSON(self),
            success: function (response) {
                alert(response.Status);
            }
        });
    };
};

1 个解决方案

#1


1  

Try to add [FromBody] attribute

尝试添加[FromBody]属性

[HttpPost]
public ActionResult Save([FromBody]Dog dog)
{
  return Json(new { Status = string.Format("Success, saved {0} with age: {1}", dog.name, dog.age) });
}

And do the following to the HTML and JavaScript

然后对HTML和JavaScript执行以下操作

<div>Name:</div>
<div><input type="text" data-bind="value: name" /></div>

<div>Age:</div>
<div><input type="text" data-bind="value: age" /></div>

<div><button data-bind="click: save">Save</button></div>

<script>
  var ViewModel = function () {
    var self = this;
    self.name = ko.observable();
    self.age = ko.observable();

    self.save = function () {
      var jsonData = {'name': self.name(), 'age': self.age()};
      $.ajax({
          url: "http://localhost:8000/home/saves",
          type: "post",
          contentType: "application/json",
          data: jsonData,
          success: function (response) {
              alert(response.Status);
          }
      });
    };
  };

  ko.applyBindings(new ViewModel());
</script>

#1


1  

Try to add [FromBody] attribute

尝试添加[FromBody]属性

[HttpPost]
public ActionResult Save([FromBody]Dog dog)
{
  return Json(new { Status = string.Format("Success, saved {0} with age: {1}", dog.name, dog.age) });
}

And do the following to the HTML and JavaScript

然后对HTML和JavaScript执行以下操作

<div>Name:</div>
<div><input type="text" data-bind="value: name" /></div>

<div>Age:</div>
<div><input type="text" data-bind="value: age" /></div>

<div><button data-bind="click: save">Save</button></div>

<script>
  var ViewModel = function () {
    var self = this;
    self.name = ko.observable();
    self.age = ko.observable();

    self.save = function () {
      var jsonData = {'name': self.name(), 'age': self.age()};
      $.ajax({
          url: "http://localhost:8000/home/saves",
          type: "post",
          contentType: "application/json",
          data: jsonData,
          success: function (response) {
              alert(response.Status);
          }
      });
    };
  };

  ko.applyBindings(new ViewModel());
</script>