Question

我有一个项目清单。通过单击一行，我看到编辑表单。绑定工作只需点击一下即可。但无论我点击第二个，第三个等等的时间，我都会看到表单填充了第一次点击的值。

物品代码初始化：

self.newManager = {
        UserId: ko.observable(),
        CustomerId: ko.observable(),
        UserName: ko.observable(),
        DisplayName: ko.observable(),
        Email: ko.observable(),
        IsActive: ko.observable(true),
        Password: ko.observable(),
        ConfirmPassword: ko.observable(),
        Roles: ko.observableArray()
    }

获取详细信息代码：

self.getManagerDetail = function (item) {
    self.newManager.UserId(item.UserId);
    self.newManager.UserName(item.UserName);
    self.newManager.DisplayName(item.DisplayName);
    self.newManager.Email(item.Email);
    self.newManager.IsActive(item.IsActive);
    self.newManager.CustomerId(item.CustomerId);
    self.newManager.Roles(item.Roles.$values);

    self.showManagerForm("editManagerForm");
}

表单HTML：

<form class="form-horizontal" id="editManagerForm" style="display: block;" data-bind="submit: editManager">
<div class="form-group" data-bind="with: newManager">
<label class="control-label">Login</label>
<div data-bind="text: UserName"></div>
<label class="control-label" for="DisplayName1">Name</label>
<div>
  <input class="form-control" id="DisplayName1" type="text" data-bind="value: DisplayName" data-val="true">
</div>

<label class="control-label" for="Email1">Email</label>
<div>
  <input class="form-control" id="Email1" type="text" data-bind="value: Email" data-val="true">
</div>

<label class="control-label">Is active</label>
<div>
  <input class="form-control" id="IsActive" type="checkbox" data-bind="checked: IsActive" data-val="true">
                        </div>
<label class="control-label">Roles</label>
<div data-bind="foreach: $root.roles">
  <div class="checkbox">
    <label>
      <input type="checkbox" value="God" data-bind="checked: $parent.Roles, value: $data">
        <span data-bind="text: $data">God</span>
      </label>
  </div>

      <div class="checkbox">
          <label>
              <input type="checkbox" value="MarketingGuy" data-bind="checked: $parent.Roles, value: $data">
              <span data-bind="text: $data">MarketingGuy</span>
          </label>
      </div>

      <div class="checkbox">
            <label>
                <input type="checkbox" value="Accountant" data-bind="checked: $parent.Roles, value: $data">
                <span data-bind="text: $data">Accountant</span>
            </label>
        </div>

        <div class="checkbox">
            <label>
                <input type="checkbox" value="Manager" data-bind="checked: $parent.Roles, value: $data">
                <span data-bind="text: $data">Manager</span>
                </label>
            </div>
        </div>
    </div>
    <button class="btn btn-default ajaxbutton" type="submit">Сохранить</button>
</form>

我在调试器中逐步检查了self.getManagerDetail。值按我的预期设置 - self.newManager值设置为点击项目的值。

这种行为可能是什么原因？

Answer 1

此行为是由将一个对象self.newManager绑定到两个表单引起的。我用它来编辑和创建表单。一旦我改变代码以使用一个对象用于编辑表单而另一个对象用于创建表单，它就会开始正常工作。

希望它有用。

让事情变得严谨起来的神奇之处在于你刚才解释了事情再次发挥作用。

knockout.js只绑定一次值

1 个答案: