Question

我有一个视图，显示从ViewModel填充的用户列表。

    function MyUser(data) {
     this.Id = ko.observable(data.Id);
     this.phone = ko.observable(data.Phone);
     this.Company = ko.observable(data.Company);
     this.SelectedGrowerID = ko.observable(data.SelectedGrowerID);

     this.setSelectedClass = function (item, event) {
        $('#hfGrowerID').val(event.target.id);

      this.SelectedGrowerID = event.target.id;
    };
   }

    function UserListViewModel() {
    // Data
    var self = this;
    self.users = ko.observableArray([]);

    // Load initial state from server, convert it to MyUser instances, then  populate  self.users
    $.getJSON("UserList/GetAllUsers", function (allData) {
    var mappedUsers = $.map(allData, function (item) { return new MyUser(item) });
    self.users(mappedUsers);
    });

我有一个简单的表单，其中列表项绑定到每个用户的公司。另外，我有一个隐藏字段，当我点击每个列表项时，我会保存用户的ID。

        <form action="UserList/Save" method="post">
          <ul id="UserList" data-bind="foreach: users" data-role="listview">
            <li data-bind="click: setSelectedClass"><a data-bind="attr: {id: Id}">
            <span data-bind="text: Company" /></a></li>
          </ul>

          <input id="hfGrowerID" type="hidden" />
          <input type="hidden" name="users" data-bind="value: ko.toJSON(users)" />

          <button type="submit">Save</button>
        </form>

在我的UserListController中，我想获取隐藏字段'hfGrowerID'的值。保存功能如下所示：

     <HttpPost()>
     Public Function Save(<FromJson()> users As IEnumerable(Of MyUserModel),
     hfGrowerID As String) As ActionResult
       'do stuff
       Return View ("Index", users)
     End Function

现在，问题是，hfGrowerID没有任何值，而且Request.Form（“hfGrowerID”）也没有返回任何值。我通过执行alert和console.log验证了hfGrowerID在单击列表项后获得了值。

如何获取不属于ViewModel的隐藏字段的值？

非常感谢您提供任何帮助。

Answer 1

为什么不将selectedGrowerId添加到ViewModel？

如果您通过AJAX发布表单，您甚至不需要隐藏的表单字段！

我猜测setSelectedClass函数，即当用户点击您的某个<li>代码时调用的函数，当前正在设置hfGrowerID隐藏表单字段的值？

相反，让该函数在ViewModel中设置selectedGrowerId的值，并更改提交按钮，使其成为普通按钮，其click事件绑定到submitForm函数，通过AJAX发布必要的数据。

更新： 对添加到问题的其他代码的回复

我愿意打赌你的this引用会让你陷入困境。

尝试将MyUser功能更改为以下内容：

function MyUser(data) {
    var self = this;
    self.Id = ko.observable(data.Id);
    self.phone = ko.observable(data.Phone);
    self.Company = ko.observable(data.Company);
    self.SelectedGrowerID = ko.observable(data.SelectedGrowerID);

    self.setSelectedClass = function (item, event) {
        $('#hfGrowerID').val(event.target.id);
        self.SelectedGrowerID = event.target.id;
    };
}

即使看起来我只是将this替换为self，我相信this函数中setSelectedClass的含义与... {1}}相比有所不同在该函数之外的this的值，在MyUser函数内购买。

asp.net mvc3，knockout.js表单提交给服务器

1 个答案: