How to get selected records using a checkbox

[rperetz]

Hello contributor !

Please before you submit your issue, make sure all the below can be checked (note if anything is expected, you can simply add it under the relevant checkbox)

• [x] I have searched through the issue section and on stackoverflow if my issue has already been raised.
• [x] I have provided Angular version.
• [x] I have provided Smart table version.
• [x] I have set a precise description of my problem, mentioning the expected result.
• [x] I have given a way to reproduce my issue, by providing a running example, I can use plunkr. Note if you want to mimic ajax loading behaviour you can use $timeout angular service or $httpBackend.

Note that it not all the above checkbox can be marked as checked the issue will immediately be closed. Thanks for your understanding.

And don't forget to close you issue when it is solved !

Thanks again for your contribution.

[rperetz]

First thank you an amazing plug in. My issue is simple. I have this code below which works fine. I need to capture all checkboxes that are checked on from the table in my controller. The problem is I am just getting the copy of the data for the page I am on, and I can't see any selection that was done on different pages. What is the best way to get all the records that were selected?

  <table st-table="companyContacts" st-safe-src="companyContactsSource" class="smartTable">
                                    <thead>
                                        <tr>
                                            <th st-sort="is_selected" st-skip-natural="true">Selected</th>
                                            <th st-sort="contact_name" st-skip-natural="true">Name</th>
                                            <th st-sort="title" st-skip-natural="true">Title</th>
                                            <th st-sort="e_mail" st-skip-natural="true">E-mail</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr ng-repeat="companyContact in companyContacts | filter:searchContact" style="height: 24px">
                                            <td style="width: 5%">
                                                <input type="checkbox" ng-model="companyContact.is_selected" ng-disabled="!companyContact.e_mail" ng-change="contactSelectionChange(companyContact.is_selected)" style="margin-left: 5px; margin-right: 5px" /></td>
                                            <td style="width: 30%">{{ companyContact.contact_name }}</td>
                                            <td style="width: 25%">{{ companyContact.title }}</td>
                                            <td>{{ companyContact.e_mail }}</td>
                                        </tr>
                                    </tbody>
                                    <tfoot>
                                        <tr>
                                            <td class="text-center" colspan="4">
                                                <div st-pagination="" st-items-by-page="7" st-displayed-pages="5"></div>
                                            </td>
                                        </tr>
                                    </tfoot>
                                </table>

[MrWook]

Hello @rperetz,

first of delete this unnecessary issue #763. Second of you didn't provide us with the angular or the smart-table version but those are not necessary for your problem. Keep in mind that a working plunk of your problem is a big help for everyone that want to help you.

Last but not least the information some help for your problem. The Information is in companyContactsSource.is_selected. Two-Way-Databinding rocks! So you can access it over $scope.companyContactsSource. If you want a new array with all companys that are selected:

var company_length = $scope.companyContactsSource.length
$scope.comanys_selected = [];
for(var i = 0; i < company_length ; i++){
if($scope.companyContactsSource[i].is_selected === true)
    $scope.comanys_selected.push($scope.companyContactsSource[i]);
}

If you want to transfer data between two controller you can use a angular's $broadcast provider or use a service. If this is your real problem i need a better explanation of your problem with a working example what you wanna do.

If you want to get changes by other users on different pages for the data you need to use a websocket i guess. Like i said please describe your problem a little further.

[rperetz]

Thank you for getting back to me. Very cool I did not expect the binding to work on the companyContactsSource I used it for the st-safe-src tag and I used companContacts on the st-table. Based on the code below I bind the ng-repeat to the companyContact object not the companyContactsSource, so I did not expect the companyContactsSource to updated with two-way binding. But as you said the companyContactsSource is actually getting updated with the two-way binding for the whole dataset which is what I needed. That is a huge feature.

<table st-table="companyContacts" st-safe-src="companyContactsSource" class="smartTable"> ... <tr ng-repeat="companyContact in companyContacts | filter:searchContact" style="height: 24px"> <input type="checkbox" ng-model="companyContact.is_selected"...

I missed that part in your docs. In my option, this feature is hidden in your docs. You may want to say that the object in st-safe-src will be updated as well with the two-way binding. maybe it's obvious...but I missed it.

smart-table first creates a safe copy of your displayed collection: it creates an other array by copying the references of the items. It will then modify the displayed collection (when sorting, filtering etc) based on its safe copy. So if you don't intend to modify the collection outside of the table, it will be all fine. However, if you want to modify the collection (add item, remove item), or if you load your data asynchronously (via AJAX-Call, timeout, etc) you will have to tell smart-table to watch the original collection so it can update its safe copy. This is were you use the stSafeSrc attribute

<table st-table="companyContacts" st-safe-src="companyContactsSource" class="smartTable"> ... <tr ng-repeat="companyContact in companyContacts | filter:searchContact" style="height: 24px"> <input type="checkbox" ng-model="companyContact.is_selected"...

On Tue, Apr 4, 2017 at 3:02 AM, MrWook notifications@github.com wrote:

Hello @rperetz https://github.com/rperetz,

first of delete this unnecessary issue #763 https://github.com/lorenzofox3/Smart-Table/issues/763. Second of you didn't provide us with the angular or the smart-table version but those are not necessary for your problem. Keep in mind that a working plunk of your problem is a big help for everyone that want to help you.

Last but not least the information some help for your problem. The Information is in companyContactsSource.is_selected. Two-Way-Databinding rocks! So you can access it over $scope.companyContactsSource. If you want a new array with all companys that are selected:

var company_length = $scope.companyContactsSource.length$scope.comanys_selected = [];for(var i = 0; i < company_length ; i++){if($scope.companyContactsSource[i].is_selected === true) $scope.comanys_selected.push($scope.companyContactsSource[i]); }

If you want to transfer data between two controller you can use a angular's $broadcast provider or use a service. If this is your real problem i need a better explanation of your problem with a working example what you wanna do.

If you want to get changes by other users on different pages for the data you need to use a websocket i guess. Like i said please describe your problem a little further.

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/lorenzofox3/Smart-Table/issues/764#issuecomment-291412302, or mute the thread https://github.com/notifications/unsubscribe-auth/AZa2w01ngzjxGFFWyRnVXlnwI-iybqRSks5rsesCgaJpZM4MyJmM .

--

---

Ronnie Peretz Don't be afraid to be wrong; otherwise you'll never be right.