I have a jqgrid with 2 frozen columns. Frozen works fine if I do not anything.
After I hide/show another columns (not frozen columns) frozen is not working.
I use free jqGrid version 4.14.0
I don't know what happen.
Can anyone help me! Thanks in advance..
If you use low-level methods showCol, hideCol, showHideCol directly then you should choose yourself which one from two solution ways provides the best performance in your case.
Showing/hiding of columns is relatively slow, because all rows of the grid, column headers (inclusive the filter toolbar) need be looked through and the inline css style on the corresponding cells be changes (display property should be set to none or the none value should be removed). After that the with and the height of the grid could be changed too. If the grid has frozen columns, then the same should be done in the frozen dives. Additionally the width and the height of frozen dives should be recalculated and the height of every row of the frozen columns should be recalculated too.
Thus one have two alternatives:
hide/show all columns which you need by calls of showCol, hideCol, showHideCol and then trigger jqGridResetFrozenHeights event on the grid to force recalculation of all width/height properties of frozen dives
destroy the frozen columns by call of destroyFrozenColumns, apply hiding/showing the columns by calling of showCol, hideCol, showHideCol and to recreate frozen columns once more by call of setFrozenColumns.
I recommend you to make some tests to choose, which one from the above two ways provides the best performance in your application.
Related
first post to StackOverflow, though I've been finding great tips for a few years here. Hope to resolve a vexing problem with handsontable.
I have an application that presents a handsontable instance with several columns whose content/format is dependent upon the value in a cell in another column. I determine the content and format of the dependent cells by way of a database query and server-side processing, the results of which are sent back to handsontable for processing in the afterChange function.
My problem is that whenever the user updates one cell in the table, ALL cells blink while the code laboriously reconsiders the formatting for ALL cells in the table. The preferred behavior would be to ONLY update the cells for which the formatting has changed, i.e., that small set which is dependent on the value that changed in the first cell. It's only these dependent cells whose contents are being changed anyway. Why redraw the WHOLE table??
I have searched and search here and elsewhere, and the closest to an answer I could find is that this is the intended behavior for the table. I don't agree...when the table is anything larger than 10 rows, the updating process is painfully slow and distracting to the user.
Any suggestions? I'm open to directly editing the handsontable js code, but would prefer to flip some flag I'm unaware of if possible.
Thanks all!
afterChange fire only one time for the cell you just updated (documentation example).
Your problem might come from an afterChange "chain reaction". The first afterChange modifies one or more related cells, triggering others afterChange and so on. If that's the problem, you can put a filter on the source parameter.
Another solution could be to work on a copy of the data to do your updates (see data binding), and once everything is fine, inject it back on the table with loadData, and ignore the loadData source in the afterChange callback.
Finally, if you still have some performance issues, you can check the performance tips, and remove any option that might slow your table (example with columnSorting)
(sorry I can't use comments to identify precisely from where your issue come...)
Here i am having problem with grid column resize.
The actual functionality i want to achieve is that i want to reset the grid column widths to some default values on click of buttons.
I successfully changed the width of column using some code, but the problem is arise now.
The problem is after resetting the column widths (i.e. setting column width) and then when i Just click on column separator causes column width change to previously set width (i.e. newwidth).
I illustrate the problem by showing images.
Just consider the images in sequence as they shown.
1. Before resizing the column.
2. After resizing the column.
3. Now reset width to default width.
4. Now just click on separator. This will cause the column to be resized again to previous state before we reset. and also causes undesired behavior when dragging as you see in next pic.
5. Width increased and undesired behavior when dragging.
I tried many things. I also found this : jQuery grid plugin - triand
But unfortunately no solution provided in it.
By using that reference, i tried to setting newWidth to 0, -1, undefined and moreover i removed it from headers. but all the things not working.
I can't understand what is happening.
Please note that there is no chance that some undesired code in project resided somewhere else causes this behavior. For the test i tried using new version of jqgrid 4.5.1, but in that also happening the same.
Please someone provide me solution for this. I am tired as i am doing this thing from many days. I am very much thankful to the one who help me.
Thank You in Advance !
I am not sure how you implemented "reset width to default width", but I hope two things should help you.
First of all jqGrid have bug in resizing of columns which looks exactly like on the "Step 5" which you described. I posted the pull request which merged to the main code of jqGrid about one month ago. You can do the same changes (two lines need be change) you your copy of jquery.jqGrid.src.js (see here details of the changes).
To implement resetting of width of columns to default width you can use the following. First you can use widthOrg of elements of colModel. After resizing of any column the original value of width will be saved in widthOrg. To change the column width one can use setColWidth method which I suggested in the resent answer.
I hope you will able to solve you problem using widthOrg, setColWidth and the bug fix bescribed above.
I have a model of about 1000 rows, with one of the columns changes every second.
I placed a cusom sort/filter model between the real model and the table view so as for the rows to be filtered immediately after they changed.
Now comes the problem:
If nothing is selected in the table view, everything just works fine; but when I have selected some rows, the table becomes lagging. The more rows selected, the more lagging it is.
Why? hope some one could give me a hint, thanks in advance!
Sorry, but there is a whole lot of potential places where performance can go down in QTableView.
The easiest way to pinpoint the slowdown is to profile the application. If you have the call(s)
that eats the cpu, it's far more simpler to deduce what is the cause and fix it.
Also you don't say much about the design of the custom sort/filter proxy. If you use QSortFilterProxyModel beware it does not scale well.
While painting the (top) header for a table with selection enabled, the function:
bool QItemSelectionModel::isColumnSelected(int column, const QModelIndex &parent) const
is called (twice for each column - but may vary on selection mode).
This function iterates through all selected rows (Line 1333 in "qitemselectionmodel.cpp" Qt 4.8.5).
So if there are many rows selected, the paint for each header column will get really slow.
Same for left header with cols/ rows switched.
The called functions are mostly not virtual - so there seems to be no way to avoid this without completely drawing your own header or hiding the header.
Maybe Qt should optimize this.
It appears there is no way to style individual cells (to, say, change the background color of a header row, for example) within a GAS FlexTable. Is that correct?
The only methods I see here are .setStyleAttribute() and .setStyleAttributes() both of which operate on either the entire application or the entire flextable as the object.
Furthermore, I see no methods that return an individual cell or subset of cells from the flextable such as a .getCell() or .getRow().
Therefore, am I correct in concluding that there is no way at this time to set the style of an individual cell in a GAS flextable? (Sorry if the answer to this question is an obvious, “There is no way to do it.” But I figured I had better check with the experts first before giving up.)
setWidget is expensive
I pull out about 500X12 table in flextable and found use setText is at least twice times faster.
Then again, I also can not figure out how to change font size in flexTable while calling setText. The background, font color etc worked, but not font size.
Setting style to individual cell is done with:
method setStyleAttribute(row, column, attribute, value) - Sets a CSS style on a cell of this FlexTable.
You have to scroll down to the second occurence of setStyleAttribute on the FlexTable page. Since the HTML anchor is #setStyleAttribute for both methods you always get the first.
A getCell method would not be useful as a flextable cell is no widget.
There is also a setStyleAttributes(row, column, attributes) method ...
There is a very easy way to do this. Instead of using FlexTable.setText() to set the contents, use the FlexTable.setWidget() instead.
And you can add a label and style it however you want to and each label can have its own style
I have a datagrid with many columns. This makes it pretty wide. Now we want to add more information to the table. Aside from removing or shortening existing columns what are some ways we might be able to add additional information without adding new columnes.
The data we want to add would be one of several values. For example:
Projected
Actual
Other
For other cases when the value was an off/on or true/false we would change the color of the row. In this case that doesn't seem to be a good option.
Another thing we considered is using an icon to indicate the information.
Any other ways this could be done?
A solution i've seen implemented with grid components is to have a column chooser - some sort of popup dialog that lists the columns and you can select which ones you would like to see in the grid. You should be able to invoke this popup by triggering it from the grid, e.g. it might appear as an option when the user right clicks and causes the context menu to appear.
Can you group related information into tabs?
an overflow area? ie a number of fields underneath the table that populate based on the selected row.
or just only show the minimum needed info and the have full details in a popup when doble clicked or something..
1) Popup on row hover
2) Drop open inline in the grid with extra info on row click
One technique I've used in the past was to create a "container" type of class that has its own labels and textboxes, and you can arrange them however you want, then insert this class into a single grid column. You still have to do some tricks on binding multiple controls that are not native "grid column" controls, but should help you along. Then, you can actually have each row a single container control in a single grid column...
You can't add completely new data to a grid without reserving a column to display it. The best solution I've seen is to provide only the essential information in the grid displaying all records, and then create a drilldown view that shows all of the data for one row. The drilldown can either be a new view in the same form, a popup for an additional window, or perhaps a mouseover popup.
I've worked on systems that use all sorts of shortcuts to display every last bit of information on a single page, and I found that it just made everything more confusing and harder to use. "Oh, that little icon there means that <insert something totally unrelated to the icon picture>."