I am looking for a way to sort columns programmatically.
Please bare in mind, I do not mean to sort the grid as you normally would with sortGrid() or whatnot. I mean to arrange the row order from left to right programmatically, after the grid has been rendered.
So, I am aware that with:
$("#myGrid").jqGrid({sortable: true});
I am able to sort the columns by dragging and dropping them in order. The idea is to allow users to sort their column, and to have a callback save the order in the database, so each user can arrange their own columns however they want.
I am doing something similar with showing and hiding columns, but have been unable to reorder the columns programmatically without actually dragging and dropping them.
Any help would be highly appreciated.
You can use remapColumns method to reorder the column programmatically without usage drag & drop.
In the answer you will find the code which shows how to save user specific choice of the column order in localStorage. I personally prefer the way as the saving of the same information on the server side in the database. Nevertheless you can implement saving of the same information in the database instead of localStorage. To do this you need just change the implementation of saveObjectInLocalStorage and getObjectFromLocalStorage functions and include the ajax call instead of usage window.localStorage.
Related
I have a simple grid with sorting on. I want to allow users to sort by any column, but at the same time I want one record to always display at last position (that record is recognized by ID). Is there a way to do this?
I'm using ExtJS 4.2.2.
I wouldn't keep a blank record for editing in the grid all the time. What I usually do is to provide the user a means to add record when he needs, let him to edit and save it.
You may have different requirements, anyway, you can see how this logic works here: Editable and Writable ExtJS Grid Example
This approach saves you from solving the sorting problem.
Can the dgrid have any functions to differentiate the rows? Data from server has two sets. One is the special set of rows that need to be displayed first on dgrid then the next set of data to be diaplayed with its own filter and sorting functions. Does dgrid support multiple data sets/store? Have to display the first data set all the time even while scrolling. I know that i can have two dgrids to accomplish this. Is it possible with one dgrid?
Thanks for the suggestions.
There isn't anything out of the box to help with something like this. I would suggest having two grids, one on top of the other, with the second having showHeader set to false. If you need to hijack the sort behavior of the header cells within the first grid, you can listen for the grid's dgrid-sort event, cancel it (with preventDefault), and programmatically perform operations on the second grid.
I have a table with many entries (4000 - 5000) with 5 columns. These are paginated and only about 20 rows are shown at a time although all data exists at the client side.
I want the user to filter different column by categories (and if possible using some wildcards), this user input will be taken using something like Form input. Note that i can perform all the operations using Javascript code, however i am unable to understand what kind of UI elements do i need to use for this purpose (I am not from a web dev. background but learning the tricks). I tried using libraries such as selectize, researched some Jquery UI plugins. In fact i also found a spreadsheet specific library (slickgrid.js) but it is slightly beyond my skill to implement.
So in essence is there a simple way to get user input to select categories in a column(s) with all data in client array ? I would love to reach a stage where i may be able to group column categories and use them to give autocomplete/ dropdown menus etc. However i am just trying to figure out a reliable way to translate user input to string to be used in code.
I have an example working here - http://jsfiddle.net/BM3kX/5
It has a piece of JSON consumed by a YUI DataTable. I have a few queries regarding the same.
The JSON has a 'imageURI' attribute from which I need to render an image [16x16] along with the 'showName' attribute in the same cell. Also, the table can have multiple rows so as the images that should be rendered on each row efficiently.
When I click on a row, the table should alert me of the selected record. But there is a twist here - I need the data exactly as the JSON which is used to render it. (I should get even the 'type' attribute even if I'm not using it anywhere in my table.)
How can I meet the above requirements? Any solutions or possibilities?
1) There is not much you can do there. I assume the images are different for each of the records so there is not a lot to optimize except sending the images in the proper size instead of having the client resize them. If the images were some sort of icons representing status, I would recommend you sent the status coded somehow and let the browser decide on how to represent it, but if they are pictures of the people, you'll just have to let the browser deal with them the best it can.
2) It is easy to reconstitute the original data out of the model for the clicked row. You don't need to keep a copy of the JSON for that row, you can turn it into JSON whenever you want (after all, model has a toJSON method to make that easy). The model for each record in a table can hold more information than that shown in the table. The column property tells the datatable what to show, the datasource what it stores. Use getRecord to reach the underlying model and JSON-encode that. If the type was there originally, it will still be there even if you don't show it.
I am trying to implement one sorting functionality in my code in php. The functionality will be like, when we click on the header of a column then that particular column's record will be sorted by ascending order and again click on the same column means the column's record will be sorted by descending order.
Please help me how to proceed with some example.
JQuery has many plugins that do this sort of thing. I have used Tablesorter with great results in my own projects.
I too recommend jQuery Tablesorter, it's an excellent little plugin.
You really want to avoid doing the sorting backend, as this will put strain on your server, but if you wanted to it would be as simple as appending an ORDER BY instruction to your query depending on what column the user clicked. Again, I do not recomment this method, I think you should do it in the frontend with a plugin such as Tablesorter.