Get row in which checkbox column is selected - knockout JS

Question

I am totally new to Knockout JS.I am having a table in which one column is input type checkbox. at the end of html table I have one button as "Add". Now what I want to do is on click of "Add" button I should be able to get all the rows in which checkboxes are checked.

HTML

<table>
        <thead>
            <tr>
                <th>Add Data</th>
            </tr>
        </thead>
        <tbody data-bind="foreach: SearchResult">
            <tr>
                <td data-bind="text: Name"></td>
                <td><input type="checkbox" class="" data-bind="checked: selectedArray"/></td>
            </tr>
        </tbody>
        <tfoot>
            <tr>
                <td><button type="button" id="addButton" data-bind="click: AddSelection">Add</button></td>
            </tr>
        </tfoot>
    </table>

Now can anybody tell me how can I get all the rows in which checkbox column is checked. I have gone through this but this didn't work for me.

send information from multiple checkbox to array Knockout js

fiddle for reference http://jsfiddle.net/smsharma/u9ts4uvf/

Answer 1

Here's the updated fiddle: http://jsfiddle.net/u9ts4uvf/1/

You can create an addItem function, that creates a new item, and adds it to the array availableItems :

self.addItem = function() {
    var item = new BookItem(1, 'Lorem Ipsum', '$0.99');
    item.Selected(true);
    self.availableItems.push(item);
};

But you also need to add a checked binding to the checkboxes to ensure that they are checked when Selected is set to true for BookItem :

<input type="checkbox" data-bind="value: id(), click: $root.toggleAssociation, checked: Selected" />