CODEWITHSUNDEEP
javascriptangularjspaginationsmart-tableangularjs-model
Joe
Joe

Reputation: 793

How to change the number of rows using a st-template

I've created a st-template that contains specific pagination functionality.

Here is mine the div that calls the st-template:

<div st-pagination="" st-items-by-page="itemsPerPage" st-displayed-pages="7" st-template="dashboard-pagination.html"></div>

Within this pagination we have a dropdown/button where the user can select the number of rows to display within the table.

<ul aria-activedescendant=""
            class=""
            role="menu"
            tabindex="0"
        >
            <li class="" ng-repeat="page in pages">
                <input
                    id="items-per-page-{{page * 10}}"
                    name="items-per-page-options"
                    type="radio"
                    value=""
                    role="menuitemradio"
                    aria-checked="true"
                    checked
                    ng-model="itemsPerPage"
                >
                <label for="items-per-page-{{page * 10}}">
                    <span class=""></span> {{ page * 10 }}
                </label>
            </li>
        </ul>

So 'itemsPerPage' updates in the template but does not reach the , which is in another html file.

I have been looking for an answer for a few hours and haven't really found one. This is my first experience working with smart-table and angularJS so I may not be using the correct key words.

Any help would be appreciated.

Upvotes: 0

Views: 45

Answers (1)

Joe
Joe

Reputation: 793

I ended up moving the items per-page html out of the template into the datatable html file. I created an array of static values that represents the number of row to display ['10','20','30','40','50']. Once the user selects one I send in the ng-model itemPerPage and the items update to that selection.

The reason it wasn't working in the template was because of the ng-repeat created a child scope so when I used ng-model it was not modify the original scope.

Upvotes: 0

Related Questions