I have a list of check boxes in an observable array and I want to control the enabling and disabling of the check boxes when they are selected, per row. For example, when entering for the first time in the dialog, only the "Copy Form" and "Unlink" would be enabled. If "Copy Form" is checked, then the "Workflow" and "Reporting" would be enabled, but the "Unlink" we would be disabled. If "Unlink" is checked, then all other check boxes would be cleared of values and disabled.
Here is a screen shot of what I am trying to accomplish:
The code (removed some stuff that just complicates what I am trying to describe):
Html:
<tbody data-bind="foreach: SubAccountsToCopy()">
<tr>
<td class="col-sm-4" data-bind="text: linkedAccountName"></td>
<td class="col-sm-1" data-bind="text: linkedVersion"></td>
<td class="col-sm-1" data-bind="text: version"></td>
<td>
<input style="vertical-align: middle" id="copyForm" type="checkbox" data-bind="checked: copyForm, attr: { 'id': 'copyForm' + $index()}">
<label data-bind="attr: { 'for': 'copyForm' + $index()}">Copy Form</label>
</td>
<td title="Also copy the Form Workflow " style="width:100px;">
<input style="vertical-align: middle" type="checkbox" data-bind="checked: copyWorkflow, attr: { 'id': 'copyWorkflow' + $index()}" />
<label data-bind="attr: { 'for': 'copyWorkflow' + $index()}">Workflow</label>
</td>
<td title="Also copy the Report Settings " style="width:100px;">
<input style="vertical-align: middle" type="checkbox" data-bind="checked: copyReportSettings, attr: { 'id': 'copyReportSettings' + $index()}" />
<label data-bind="attr: { 'for': 'copyReportSettings' + $index()}">Reports</label>
</td>
<td title="Will unlink the SubAccount form from the Master Account " style="width:100px;">
<input style="vertical-align: middle" type="checkbox" data-bind="checked: unlink, attr: { 'id': 'unlink' + $index()}" />
<label data-bind="attr: { 'for': 'unlink' + $index()}">Unlink</label>
</td>
</tr>
The javascript side is an JSON array mapped to the observable.
Aucun commentaire:
Enregistrer un commentaire