I'm currently working on a school project where we need to display database info in a web UI.
I have a YUI3 Datatable with built in client side pagination. Now I would like to implement server side pagination due to the massive amount of data I will have to work with.
Are there any good solid tutorials on how to implement server side pagination in YUI3?
I've already gone through the API and the YUI2 tutorials I've come across have features no longer supported in YUI3..
No, not that I can find.
I've used this paginator with great success. But the documentation that did exist seems to have vanished both from the github repo and from http://blunderalong.com/yui/gallery/datatable-paginator/paginator_examples.html where it used to live. It may be worth pinging the author a message about it.
Like barnyr, I've used Todd Smith's paginator with great success. I agree that the closest you can get to a tutorial is by perusing Todd's comments in the code.
When I pinged Todd with a fix for a resizing problem, he responded that he had stopped working on it. I guess it's up to us to figure it out now. Also, he seemed to believe that YUI must have either picked up his code from the gallery or developed an equivalent solution; neither seems to be the case right now.
It is sad that blunderalong is gone -- it had lots of goodies -- but I have Todd's server-side pagination example fossilised in my repo:
https://github.com/selkovjr/bfs/blob/master/mojits/Samples/binders/index.js
And here is the server-side model that provides the data for it:
https://github.com/selkovjr/bfs/blob/master/mojits/Samples/models/samples.server.js
It is a bigger pile than you're asking for (the binder code also has row selection and inline cell editing), but at least it has the example you're looking for, almost unchanged.
We are still using YUI 2 which is really good large amounts of data.
Try http://yui.github.io/yui2/docs/yui_2.9.0_full/examples/datatable/dt_dynamicdata.html
and it might be good to do SQL sort for heavy loads which is cheaper.
You can try following examples
http://jafl.github.io/yui-modules/querybuilder/ for complete datatable implementation
or http://jafl.github.io/yui-modules/paginator/ for different pagination samples.
I have implemented paginator successfully using this example.
Related
I'm using the community version of Ag-Grid in a react-redux application. Even though AG-Grid is generally compatible with redux, implementing server-side pagination seems to be impossible!
The reasons:
Redux is asynchronous - data update does not occur right after dispatching the action
The only way to update rows and counter (lastRow index) without re-rendering the whole grid, is via successCallback as part of the grid event
Unfortunately, I couldn't find any solution for this scenario on the web. I know that other developers raised very similar concerns a couple of years ago, as can be seen here. However, no concrete update / info from the AG-Grid team is to be found.
Did anyone come across this scenario and was able to find a proper solution?
Do you know what is the official channel to reach the tech team and clarify that with them? (AG-Grid documentation does not suggest any concrete example).
Thanks in advance!
Zend Framework 2 has implemented a lot of stuff for all the layers, but like nothing for GUI.
I am missings things like datagrids, dialogs, tree-views, autocomplete fields and all the stuff one has in JSF and Richfaces.
I thougt maybe extJS could be an alternative, but theres no production ready integration yet.
Why use ZF2 when I have to write code for hours and weeks for such simple things that should already be integrated in an enterprise ready framework ?
I spent very much time now for digging into ZF2 and I learned a lot.
But because of the missing View stuff in ZF2 I'm thinking of changing to another Framework now, after weeks of hard work.
Does someone have a better solution ?
Have a look at this module, you may find what you need :
https://github.com/mwillbanks/ZfcTwitterBootstrap
Also, I suggest you to have a look at the modules page :
http://modules.zendframework.com/
I don't like to answer my own questions, but I want to close this old one and maybe it helps someone else.
At the moment I am very happy with ZfcDatagrid by ThaDafinser.
https://github.com/ThaDafinser/ZfcDatagrid/commits/master
It didn't exist when I asked the question. And as you can see in this great module, it is a lot of work to create such a component for ZF2 and as you can see, it's not just a javascript being served. There's much much more logic behind with pagination, filtering, datasources, output formatting and much more.
You don't want to do this in your controller code, because you want to reuse the grid logic and every grid instance. And you don't want all that logic on client side, because of the same reason.
I am currently evaluating grid components for our new portal project. I came across the jqGrid which I find quite interesting. One requirement I have is that the portal should work with javascript switched off.
I found this article on StackOverflow but it does not answer the question. Does anyone can tell me how jqGrid is dealing with this?
In the question which you referenced I could fine the following
Can we create the table using C# and then lay the JS over the top for
extra functionality?
Is it what you plan? Do you want that your portal works without JavaScript and produce pure HTML tables which hold the data without any Ajax requests, but in case of the user do has JavaScript on you want to use JavaScript, jQuery and jqGrid?
In the corresponding answer it was suggested to use tableToGrid function to convert the existing HTML table inclusive the contain to the jqGrid. It seems me the way which you can also follow. Why you are not satisfied with the answer?
To tell the trust I have no customers more where JavaScript is switched off. Do you want to develop the portal for some mobile devices or some other special endpoints which has no JavaScript? In my opinion JavaScript have to be on to be able to use Internet for the better productivity. So the portal which work without JavaScript will have the interface which is not up to date now. Either you have very special customer environment or the requirement seems me too hard.
I have looked at a number of examples (e.g. http://www.dotnetcurry.com/ShowArticle.aspx?ID=618 and http://msdn.microsoft.com/en-us/magazine/gg650669.aspx) but it seems very manual and convoluted.
The reason I would like to use the WebGrid is that there are no external dependancies, but I have very succesfully used jqGrid on another project.
Has anyone else succesfully managed to get server side paging working on the MVC3 Webgrid and would you recommend I use that rather than the jqGrid?
The MSDN article illustrates a perfect example of how to achieve server side paging. No matter which grid you use on the client, on the server that's a good way to paginate your data. As far as the WebGrid helper is concerned, I would recommend you MvcContrib.Grid or Telerik Grid if you are looking for a server side grid. If you are looking for a client side grid, jqGrid is really nice.
You might find some commercial components for which the server side code doesn't look convoluted to you but bear in mind that with such solutions you don't know how what is happening under the covers, even worse you might lose control, which usually ends up with late night calls from your db administrators telling you that your queries are just a horror.
Our team is experienced in web development (tomcat/Oracle) but not with AJAX on our existing projects. This is new technology for us, so I want to introduce this carefully and correctly.
What should I look at in terms of frameworks or best practice or common pitfalls?
read this:
progressive enhancement
and use a library such as jQuery, mootools, or YUI it'll save you many headaches with cross-browser implementation. this will show you why you want to use a library.
My first recommendation would be to explore the different frameworks available and see what your team prefers in terms of coding style. Most of the frameworks have the same basic features so a lot of it comes down to preference. I prefer jQuery, so that is my first recommendation, but I worked with YUI, MooTools, Prototype and EXT JS before making my decision.
Secondly, I would recommend working AJAX functionality as a progressive enhancement, allowing your apps to work with and without JavaScript. I find that this approach also ensures a solid, working application before worrying about adding the bells and whistles.
Head First Ajax is a good book IMO for getting started with the basic concepts behind working with Ajax. It would probably be a good place to start for your team to gain some knowledge of what is happening behind the scenes in whatever framework you choose.
One thing we struggled with when starting to use ajax was how often to use it.
We had no exact requirement as to where we were supposed to use ajax and not, and initially we erred to the side of using it too much. This affected application complexity quite a lot.
If you think of your inter-page-structure as a state-machine, ajax introduces nested state-machines within each page-state. The moment your sub-state machine ends up with a number of distinct states (I'd say anything over 2), you should think really hard about using a traditional approach.
The best starting point is to try to get a mix og full page reloads and ajax, and be conservative until you're sure you're getting really good at it.
Don't use it where you don't need it.
Long running operations that need to send the client some status updates? Use AJAX.
Markup for major UI elements (menus, ect)? Use plain old HTML.
Basically, use AJAX for transmitting data only. If you try do fancy things like dynamically pulling in UI elements on the client side with AJAX, you are in for a world of hurt when you get a client who wants to use ie5 (they exist), or a non-pc based browser.
first, look at the user interface you already have, and consider where it might make sense for its elements to be able to change/react independently. This is where your ajax enhancements might make sense
second, look at libraries as noted in the other answers (I like AJAXPRO for its simplicity, but it has been discontinued)
if you find that all of your page elements tie together and cannot change independently, then there is really no need for ajax
otherwise, consider how you will access the page state from your ajax enhancement points - depending on which ajax framework you use, you may or may not have access to the entire page object, session state, original request parms, etc. Consider these issues up front to avoid coding yourself into a hole and/or having to make messy workarounds.
If you were on .Net or Mono I would encourage you to use Ra-Ajax which abstracts away JavaScript completely. Though I work for Ra-Ajax (inventor) so I am biased...