Datatables.net select all rows on table including not shown - javascript

I want to manipulate the dom of all rows on a table but when I use a class to select buttons on my rows, only the 10 rows and the buttons on them shown with pagination will be selectable as jquery objects. Is there a way to select any row on a table regardless of being shown or not?

I'm seeing two different questions here. If you want to "manipulate" all rows in some way (like adding 100 bucks to a column, etc..), I would do that at the 'source' of my data (array, database table, whatever), then refresh the Datatables. If you simply want to "select" any row, you can use the Datatables 'search' functionality. It's pretty well documented at https://datatables.net/reference/api/search() . Am I not understanding your question?

Related

table with resizable columns, should have columns added / removed dynamically & sortable values with in columns

I have requirement to develop a list display which should be a table with resizable columns, should have columns added / removed dynamically & sortable values with in columns.
The columns are needed to be added and removed dynamically. Initially some columns can be displayed by default. Later additional columns can be added by choosing from a drop down for columns selection.
Initially one column is sorted by ascending order.
We are using HTML 5 with angularjs on UI layer.
I tried searching for plugin or javascript libraries but none of them provided all the features which matches all our requirement.
Can you please provide a good suggestion of how to go about this situation?
You can use ng-grid and customize it accordingly. However, we have used jqx library since it has many other items including grid-
Link for grid-
http://www.jqwidgets.com/jquery-widgets-demo/demos/jqxgrid/index.htm?(arctic)
For adding column dynamically, you can update the column definition in runtime which will help you to add/delete columns.
All other features you mentioned are included as features by jqx itself.

get data from main grid to populate subgrid

I need to populate my subgrid which shows some of the columns from main grid without actually going and getting data again using URL? Example:Main Grid is getting data from server (10 columns) using jsonReader. Out of which I want to show 7 columns in the parent row and 3 columns in the subgrid row . Can I do this? (Or some other way to achieve this expand concept?)
One possible workaround to use the sub-grid as 1-1 with main grid, instead of as parent-child : query all the columns as normal in the parent grid, but set the ones you don't want in main row as hidden. Then in sub-grid load event, access those fields using the "parent" row id and create them as custom fields or simply emit custom html.
This does cause duplication of the fields though, since the original main grid fields are still present, even if hidden. The html ids will get duplicated and may cause conflicts if you don't handle them.
Perhaps there is a cleaner way to do it than this (which I'm sure #Oleg will show us any minute now!)
But I wish jqgrid had a documented feature to more easily handle this kind of thing. It is very useful because you get the benefit of full inline editing in the subgrid, so you can design a much nicer edit form (eg. multiline textareas) than when confined to one straight line.
Note the presence of this feature in other grids.
Jquery EasyUI Datagrid demo
Telerik Grid Editing Demo

jqGrid multi-select sort/show checked items at the top always

I have a a jqGrid that shows as list of rows ... several thousand.
When the grid loads, it will pull down all the data with their previous selections already checked.
My questions is, how do I set the sort order to always show the selected items at the top?
Thanks in advance!!
You question seems be very close to another one which I answered recently (see here). If you has several thousand or event thousand rows you should use paging of date to improve performance of the grid. The solution which I suggested is very simple and it supports saving of selected state over the paging.
One more remark. If you have jqGrid with local data you can implement custom sorting of data. To do this you just need define sorttype as function. If the data need be sorted by a column jqGrid will compare items. The function sorttype should just return any string or number which should be used instead of the cell value. In the case you can easy place for example selected items at the top of grid. You can find examples of custom formatting here, here and here.

jqgrid select multiple cells?

Is there a way in jqgrid to select multiple cells? Ideally I want to toggle different cells and be able to restrict it in a way that only 1 cell can be toggled on in each row.
Is jqgrid suited for this or should I be using a different library?
Your requirement reminds me the requirement to select words in the grid instead of rows. You can implement this, but jqGrid could not help you here. On the other side if you select a row you can use Edit or Delete navigator button to remove it. There are internal parameters selarrrow and selrow which hold the id of the selected row.
If you really need to implement such custom selection you can use beforeSelectRow or onCellSelect event handler to do this. Yon can save the list of selected cells in your custom variable. You can use .addClass("ui-state-highlight").attr("aria-selected","true") for the <td> element instead of <tr> what jqGrid do. It is important that you will be not able to use any editing features of jqGrid in the case.

jQuery table data sorter plugin for tables with multiple <th> rows

I have a set of tables in a build that use the Tablesorter 2.0 jQuery plugin to sort columns of data. It works perfectly fine until I get to a more complex table that has multiple TH rows.
Tablesorter 2.0 automatically detects the first set of THs and makes them the sorting trigger. There's no way to override this with a selector.
My complex table has multiple TBODYs with rows of THs on top like so:
I'm going to give www.datatables.net a go to see if it has a way around this but I'm worried I could run into JS conflicts with both plugins running on the site.
Any other suggestions of how to achieve table sorting within each TBODY using the row where you see 'My Equity' as the sort headers NOT the dark grey header row at the top?
An example of the source HTML is here: http://pastebin.com/CYd06L87
Datatables is a very powerful grid sorter and you should have no problem using multiple TH's. They also have solutions for table details, which might be an alternate way to approach this task. For example, you could have two main rows, one for your equity and one for your equity, all in the same table. Then, setup row details to accomplish your goal...just one possibility.
Here's the row details tut: http://datatables.net/release-datatables/examples/server_side/row_details.html
There's also a solution for summing row totals.

Categories

Resources