Select/Unselect Checkboxes - KnockoutJs

Posted by Sharpcnet under JavaScript on 7/23/2014 | Points: 10 | Views : 2026 | Status : [Member] | Replies : 5
The Header Checkbox when checked, should check all the child boxes. When the checkbox in header is checked or unchecked, nothing happens. When any checkbox in a row is checked/unchecked, it checks/unchecks all the checkboxes. What is going wrong here.

index.cshtml:
<th>
<input type="checkbox" data-bind="checked: $root.SelectAll"/>
</th>
<tr>
<td>
<input type="checkbox" data-bind="checked: $root.SelectedChoices" />
</td>
</tr>

JS:

//SelectedChoices is ko.observableArray([])

ViewModel.SelectAll = ko.dependentObservable({
read: function () {
return ViewModel.SelectedChoices().length ==
ViewModel.ClientData().length;
},
write: function (newValue) {
ViewModel.SelectedChoices(ViewModel.SelectedChoices().length ==
ViewModel.ClientData().length ? [] :
ViewModel.ClientData().slice(0));
},
owner: ViewModel
});


The logic used is exactly as in http://jsfiddle.net/rniemeyer/kXYuU/, just that, table's used instead of ul-li




Responses

Posted by: kgovindarao523-21772 on: 7/23/2014 [Member] [MVP] Bronze | Points: 25

Up
0
Down
Hi,
try like this.
<th>

<input type="checkbox" data-bind="checked: SelectAll"/>

</th>
<tbody data-bind="foreach:ClientData">
<tr>

<td>

<input type="checkbox" data-bind="checked: viewModel.SelectedChoices" />

</td>

</tr>
<tbody>

revert back if any concerns.

Thank you,
Govind

Sharpcnet, if this helps please login to Mark As Answer. | Alert Moderator

Posted by: Sharpcnet on: 7/24/2014 [Member] Starter | Points: 25

Up
0
Down
Thank you, But it did not work. The records dont even load if I say viewmodel.selectedchoices.
The data-bind for tbody exists in my code.

Sharpcnet, if this helps please login to Mark As Answer. | Alert Moderator

Posted by: kgovindarao523-21772 on: 7/24/2014 [Member] [MVP] Bronze | Points: 25

Up
0
Down
change ViewModel instead of viewmodel, and try.

Thank you,
Govind

Sharpcnet, if this helps please login to Mark As Answer. | Alert Moderator

Posted by: Sharpcnet on: 7/24/2014 [Member] Starter | Points: 25

Up
0
Down
Seriously....do you think, it is typo's.....?????????????????

Dude...cmon...

Sharpcnet, if this helps please login to Mark As Answer. | Alert Moderator

Posted by: kgovindarao523-21772 on: 7/24/2014 [Member] [MVP] Bronze | Points: 25

Up
0
Down
:) Post your VS solution/Pages here, in case if you don't have any data base dependencies. I will check and let you know.

Thank you,
Govind

Sharpcnet, if this helps please login to Mark As Answer. | Alert Moderator

Login to post response