我有一个表,每行有2个输入,所有输入都绑定到self.editing = ko.computed(…)
,即,对于表中的每个元素,我都必须绑定到<input type="number" data-bind="textInput:myObservObj, enable: editing" />
我如何避免这种情况,并让其他东西可以接受一个可观察的对象,在这种情况下,编辑和启用/禁用表中的所有输入?
下面是我完整html代码(正如您所看到的,我必须在所有地方重复enable: $parent.editing
):
<table>
<thead>
<tr>
<td style="width:115px"></td>
<td style="margin-right: 10px">Left</td>
<td>Right</td>
</tr>
</thead>
<tbody>
<tr>
<td><label>Type (Jerger)</label></td>
<td>
<span data-bind="with:leftEarTympanometry">
<select data-bind="options: availableTypes,
value: type,
optionsCaption: 'Choose...', enable: $parent.editing, style: { borderColor: 'black' }"></select>
</span>
</td>
<td>
<span data-bind="with:rightEarTympanometry">
<select data-bind="options: availableTypes,
value: type,
optionsCaption: 'Choose...', enable: $parent.editing, style: { borderColor: 'black' }"></select>
</span>
</td>
</tr>
<tr>
<td><label>Pressure (daPa)</label></td>
<td>
<span data-bind="with:leftEarTympanometry">
<input type="number" data-bind="textInput:pressure, enable: $parent.editing, style: { borderColor: pressureInvalid() ? 'red' : 'black' }"/>
</span>
</td>
<td>
<span data-bind="with:rightEarTympanometry">
<input type="number" data-bind="textInput:pressure, enable: $parent.editing, style: { borderColor: pressureInvalid()? 'red' : 'black' }"/>
</span>
</td>
</tr>
<tr>
<td><label>Peak (mmho)</label></td>
<td>
<span data-bind="with:leftEarTympanometry">
<input type="number" data-bind="textInput:peak, enable: $parent.editing, style: { borderColor: peakInvalid()? 'red' : 'black' }"/>
</span>
</td>
<td>
<span data-bind="with:rightEarTympanometry">
<input type="number" data-bind="textInput:peak, enable: $parent.editing, style: { borderColor: peakInvalid()? 'red' : 'black' }" />
</span>
</td>
</tr>
<tr>
<td><label>Volume (cc)</label></td>
<td>
<span data-bind="with:leftEarTympanometry">
<input type="number" data-bind="textInput:volume, enable: $parent.editing, style: { borderColor: volumeInvalid()? 'red' : 'black' }"/>
</span>
</td>
<td>
<span data-bind="with:rightEarTympanometry">
<input type="number" data-bind="textInput:volume, enable: $parent.editing, style: { borderColor: volumeInvalid()? 'red' : 'black' }"/>
</span>
</td>
</tr>
</tbody>
</table>
1条答案
按热度按时间of1yzvn41#
您可以创建自定义绑定,如下所示:
然后在表单上,根据您要禁用还是启用所有控件,将enableAll绑定为true或false,如下所示: