I have three divs (on the same page)with different id that I would like to use pagination for. I am using CakePHP's inbuilt pagination method to bring about this. The first page for all the divs are displayed correctly. But if I am in the first page of the second div and click the next link, I get the next items of the first div.
And similarly, If there are no items for the third div for the second page, yet I get the items for the first div.
How can I go about setting up pagination to control the three lists independently?
There is a post about this on the Debuggable site.
How to have multiple paginated widgets on the same page with CakePHP
If you want to use inbuilt pagination, you won't be ale do this.
Thus, you have to write your own pagination. or just create new helper extends on the original one
Related
I'm trying to create tabbed list view where I have a filtered list of users in every tab. The problem is that the pagination on the bottom is one for all tabs it doesn't change. When I use it it tries to change the page of all tabs.
What I did is to put List in every Tab and I have a Datagrid in the List.
Is there anything I can do for the pagination?
This won't work unless you rewrite the List component completely.
I suggest you to have a custom menu instead, with an entry for each of your current tabs and defining the filters in the menu item urls.
I have made a pagination for a list by Bootstrap and Backbone. The list contains links for different pages. What is the best way to to "save" the pagination "page" when user goes to different page and comes back to page where the pagination is the pagination gets resetted to page one. I can't use hash because there are many bugs with window.history.back(). Are there any decisions? Or how can I use cookies?
The standard way to do this is to use routing; When you press the back button from browser you will be redirected to the last route; If you have a custom back button on the page, add on your page model last_page property. When you render the page set the route as url address.
Maybe you have problem with your application structure. BackboneJS used to write single page. So that, when you choose different page index, your page should not reload, only new data is applied to your table. You should start with this book http://addyosmani.github.io/backbone-fundamentals/
Need to create nested tabs.
In a page there will be multiple Person id tabs as outer tabs and on clicking each tab it will open inner tabs like Home,Office etc., and on clicking inner tab - Home, the tab content will display.
Outertab: Person 1 Person2
Innertab: Home Office
Refering the site - http://angular-ui.github.io/bootstrap/ , created outer tabs with content. created 2 separate tabset but not able to give link between the two tabset.
Can someone help me how to write directive for nested tabs? Any reference links?
I believe that AngularUI Router is what you are looking for. The majority of UI-Router's power is in its ability to nest states & views. Follow the link I've provided and take a look at the section Nested States & Views.
This Plunker example incorporates AngularUI Router to achieve a similar functionality you are looking for.
[EDIT]
This layout composed of nested views is exactly what for the AngularUI Router is used for:
So TabsTemplate will dynamically render the first level of tabs (any number).
TabTemplate could be a template without any dynamic content as Home and Office tabs are always there.
OfficeTemplate and HomeTemplate are again templates that are populated dynamically based on the selection of the current person.
You can refer to how angular bootstrap tabset directive is written.
Reading the tab code helped me understand how directive work. Now I can build many components from the ground up.
I build myself a simpler version of the tabset directive, it doesn't render the content, just the tab-heading element. So I can decide what inside the content via a tab selected callback. And for nested tabs, I just need to put in another tabset directive.
I am new with angularjs and I am trying to add some dynamic content to the DOM.
What I want to do is a little bit like twitter for example.
I have a table with different rows and if the user click on a row, there is some details ajax loaded just ender the row.
I have a template for the row details (which I want to display (and compile) just ender the clicked row.
As I don't realy understand how to trigger a directive with click, I have tried to do it from a controller function (with ng-click on the row) but I can't compile (I only have the template displaying).
If anyone has an idea how to do it (and best, a way to do it with directive as it seems to be the right way to do it).
Thanks
Since it is not clear how complicated your template is that you want to add, you may not need a directive — ng-repeat on the <tr> element may be enough. On the AngularJS home page, the "Wire up a Backend" demo, tab list.html shows how to dynamically add rows to a table using ng-repeat, with data that was retrieved via the query() method. Is this sufficient for your needs?
I have two data grids. The first auto-loads a list of items (json data store). OnCellClick the first grid fires a dynamically parametrized url and loads data into the second grid. It works fine, but the pagination of the second grid does not focus the new context.
What shall I do to make the pagination work with the new url?
hm your pagination and second grid (which is the one to be dynamical) should share the same store, now on cell click you should only reconfigure the store and start loading it.
if you do like this both grid and pagination will work just fine...
i think currently your paginations uses another sotre (another instance or something) but it MUST use the same store as the second grid...
Not sure what you exactly mean with "does not focus the new context", but are you passing the start and limit parameters to the second grid in the params array of the jsonStore.load call?
If you just want to focus the grid on certain row, you can use focusRow method of GridView.
Perhaps you could post a code example if this did not help?