KnockoutJS动态CheckBox绑定

时间:2016-03-21 09:13:47

标签: checkbox knockout.js

我有一个具有不同数据类型的属性列表,如果数据类型是一个复选框,那么我希望将字符串中的值绑定到复选框。我设法将数据库中的值绑定到UI。但是如果对值有任何修改,我无法从列表中捕获它。有人可以就此提出建议吗?

感谢。

UI代码

<tbody data-bind="foreach: data().Attributes">
        <tr>
          <th data-bind="text: AttributeName"></th>
            <td>
                <span data-bind="if: AttributeDataType === 'CheckBox'">
                    <input class="input-sm" type="checkbox" data-bind="value: AttributeValue, checked: $parent.ConvertToBoolean(AttributeValue), visible: $parent.editMode() " />
                </span>
                <span data-bind="if: AttributeDataType === 'Text'">
                    <input class="input-sm" type="text" data-bind="value: AttributeValue, visible: $parent.editMode() " style="min-width: 300px;" />
                </span>
                <span data-bind="if: AttributeDataType === 'DropDown'">
                    <select class="selectpicker" data-bind="options: $parent.availableTestProgramType, value: AttributeValue, visible: $parent.editMode() "></select>
                </span>
            </td>
        </tr>
      </tbody>

脚本

 public data = ko.observable<any>([]);
public ConvertToBoolean = (x: string) => {
  return x == "true" ? true : false;  }

1 个答案:

答案 0 :(得分:0)

我设法通过将click事件添加到复选框并更改基础数据值来解决我的问题。

UI代码

 <input class="input-sm" type="checkbox" data-bind="checked: $parent.ConvertToBoolean(AttributeValue), visible: $parent.editMode(), click: $parent.toggleAssociation " />

脚本

public toggleAssociation = function (item) {
  if (item.AttributeValue == "" || item.AttributeValue == "false") {
      item.AttributeValue = "true";
  } else {
      item.AttributeValue = "false";
  }
  return true;

}