reactive-table icon indicating copy to clipboard operation
reactive-table copied to clipboard

rowsPerPage

Open sarita-dc opened this issue 9 years ago • 17 comments

How can I have rowsPerPage in dropdown instead of a textbox. Also right side pagination I want to show numbers with previous and next buttons.

sarita-dc avatar Feb 18 '16 09:02 sarita-dc

You can use ReactiveVars to control rowsPerPage and currentPage, see https://github.com/aslagle/reactive-table#accessing-and-controlling-table-state.

Then set showNavigation: 'never' in the table and have your dropdown and page buttons set the ReactiveVars.

aslagle avatar Feb 18 '16 13:02 aslagle

I used dropdown to select rows per pages and set a ReactiveVars but when i put rowsPerPage: Template.instance().teamsrowsperpage.get() my reactive table doesnt update.

sarita-dc avatar Feb 19 '16 05:02 sarita-dc

You need to use Template.instance().teamsrowsperpage, without .get(). get will give the table a single value instead of the reactive var.

aslagle avatar Feb 19 '16 12:02 aslagle

I tried still its not refreshing the table. when I change in dropdown I get Page 1 of 0

sarita-dc avatar Feb 22 '16 10:02 sarita-dc

Make sure you're setting it to an integer, if you're getting a string from the dropdown you may need to use parseInt.

aslagle avatar Feb 22 '16 13:02 aslagle

It is integer. Do i have to subscribe Reactive.publish()?

sarita-dc avatar Feb 23 '16 04:02 sarita-dc

No, it does the subscription for you. If the table showed up with pages before you changed the dropdown and after you changed it you got page 1 of 0, it sounds like you set rowsPerPage, but it's something invalid.

aslagle avatar Feb 23 '16 05:02 aslagle

Could you please tell me what I'm doing wrong... Publications.js Meteor.publish('team', function () { return team.find(); });

ReactiveTable.publish("team-items", function () { return team; }, {});

teams.html {{> reactiveTable collection="team-items" class="table listing-list responsive-table team-listing-table" settings=teamsSettings id="teamsSettingsId"}}

<section class="listing-pagination">
                <div class="row">
                    <div class="col-md-6">
                        <select id="rows_per_page" name="" class="form-control">
                            <option value=2>2 rows per page</option>
                            <option value=4>4 rows per page</option>
                            <option value=6>6 rows per page</option>
                        </select>
                    </div>
</div>
</section>

teams.js Template.teams.onCreated(function () { this.teamsrowsperpage = new ReactiveVar(3); }); });

reactive tables rowsPerPage: Template.instance().teamsrowsperpage,

'change #rows_per_page': function(e, template){ var rows_num = parseInt($('#rows_per_page').val()); template.teamsrowsperpage.set(rows_num); }

sarita-dc avatar Feb 23 '16 05:02 sarita-dc

Sorry - your code looks fine but I think there must be a bug in the package where it doesn't update the subscription when the vars change. I hadn't done it with server-side publishing before. I'll try to fix this soon.

aslagle avatar Feb 23 '16 06:02 aslagle

I released a new version (0.8.27) that should fix this. Try it again and let me know :)

aslagle avatar Feb 27 '16 18:02 aslagle

When I updated the package the latest version what I got is 0.8.26 and tried with my code still doesn't work.

sarita-dc avatar Feb 29 '16 09:02 sarita-dc

I'm not sure why meteor wouldn't pick up the update, but you can edit .meteor/versions directly to make sure it uses the right one.

aslagle avatar Feb 29 '16 13:02 aslagle

It worked. Thank you very much. Is there any settings to pass current page in table? My next part of pagination is << 1 2 3 4 5 >>

sarita-dc avatar Mar 01 '16 05:03 sarita-dc

Its working. I passed currentPage in table and onclick I set ReactiveVar value from nav. Thank you once again :)

sarita-dc avatar Mar 01 '16 06:03 sarita-dc

I got a issue with my search now. I have a helper with search results and want to pass it in reactiveTable. Before I was passing that result in collection of reactive table but after using reactiveTable.Publish I dont know how to pass that result.

sarita-dc avatar Mar 04 '16 11:03 sarita-dc

If you have the search results already, there's not really any reason to use ReactiveTable.publish. I'd continue passing them in the way you were before. If you really want to do it, you'd have to create a filter and set it using the search results.

aslagle avatar Mar 05 '16 15:03 aslagle

Yes i removed ReactiveTable.Pubish.

sarita-dc avatar Mar 07 '16 04:03 sarita-dc