I have a large HTML table of data (560 rows and 60 columns) that I display when my application loads.
I had too much display time (5 seconds), I fixed this problem by rendering server side on initial load thanks to Nuxt.js, now the display is almost instantaneous.
The data displayed by this table changes depending on the checkboxes.
The data is collected in a computed property.
My problem is the following: each time a box is checked or unchecked, it is the whole of my data table which is reloaded and re displayed which causes a significant latency between the moment when the box is checked or unchecked and the new display of my table ...
Would there be a way for it to be only the row (s) that are modified by the checkboxes that are modified at the display level and not my entire table.
Related
I have long list of rows in interactive grid. As I scroll down, the grid loads more rows. The select all checkbox on top only selects the rows that have been rendered in the view. Is there a way to select rows that have not been rendered yet? or Is there an event that gets fired when loading is complete?
There is no event that occurs when the last page of results is loaded.
You can detect if the last page has been loaded using this undocumented / unsupported method:
var g = apex.region("emp").call("getViews","grid");
if (g.model._haveAllData) {
// all the rows are now shown
}
To load an additional page of results:
g.view$.grid("lastPage");
Note: don't do what I did and try to put these in a simple Javascript loop - this fails because the loop wouldn't wait until each page is loaded before trying to load another.
An approach I might take if the number of records is expected to be <1000, is to change the pagination to Page, and the number of records per page to 1000. That way you know they'll all be loaded initially.
I have an angular webpage. One of the page sections (an angular ui grid) contains nearly 1000 rows of data. Each row has 7 columns. (There is no table tag available anywhere in the HTML the grid is made using nested divs)
At a time only 20 rows will be shown in the page section. Now using ruby and selenium I need to verify whether data displayed in 7th column is sorted in ascending order or not. I tried to do this by reading the contents of the
angular ui grid to an array of arrays. But at any point of time when I fetch the elements data for only 20 rows are getting stored. After loading this page I tried again by doing a horizontal scroll and fetching the data.
But still I get only 20 rows of data everytime I try. I believe only the data for the visible rows at the point of execution is only getting fetched. And I think the data is loaded dynamically to 20 rows on demand which
are visible in the section.
Now what is the best logic I could use to verify whether data displayed in 7th column or any other column is sorted in ascending order or not !
From your description what I understand is all 1000 rows will be stored in page source during page load. And on demand any 20 rows will be loaded from page source as user scrolls down or scrolls up in the page section. In this case, the best option will be to collect data from the source and store all of it to an array as per need. Which can be done as
browser.execute_script("return angular.element("your element.functionWhichloadsallRows)").collect{|e| e.values}
I'm having an issue with a my current dgrid. I have a column which is dijit/Form/FilteringSelect with a Ajax-based store. The store works fine for searching and populating, but, when I open a page with the dgrid store having a couple of rows already I face a problem. Only the last FilteringSelect triggers the edit event and fires the XHR request.
For example, if the Grid store has 4 items, so it will have 4 rows, only the FilteringSelect of the last row will go to the server to get the display value.
I'm a bit lost, any help?
Currently, my report is set up with a Child table placed in a row of a Parent table. Each row of the child table has a Grid element that allows me to have more control over the format of the report. There are several fields in the child report with varying field lengths so a Field per Column of the report won't work. Note that I am only setting the data source of the Tables, not of the grid elements.
This works when rendering to HTML, however, when rendering to a PDF file a page break appears just before the row containing the child page.
Things I have tried to resolve the issue with:
Setting page breaks to "Avoid"
Setting the page break interval to something high
Tested with 2.6.2 and 3.7.2. 4.2 currently will not run on my machine.
When you using a column for each field in the table instead of a Grid element in a single cell, the problem goes away but this is undesirable as there are multiple fields with varying field lengths. Merging multiple cells to make room for the different lengths does work, but it can become unruly when you need to change the report format.
The size of the grid/table does not matter - this happens even when I am only using a couple fields from the data set.
After some more experimentation, I found out that if I remove all Detail Rows of the Parent table that are before the Child Table row, the report is created properly. Unfortunately I need to have rows of information ahead of the Child Table so this does not solve the issue.
Does anyone have a solution?
I am having huge data, to display this I am using grid with paging enabled,
and loading the first page data.
How i can load the next page data in the back ground ??
so that when the user clicks next button I will show the data which is preloaded.
Any work around.
Thanks in advance,
kkchaitu
The simpliest solution could be a loading whole set of data to the store and use Paginating Toolbar for filtering purpose, however you refering that amount of data is "huge" - this could make solution uneffective...
or
Have 3 set of data ready (before - empty at start, actual, and after) and overwrite onload events:
after loading - display and load next, (or previous),
before load check is next (or previous) is avaible - use it, change what is prevoius, actual, next, prepare what should be loaded after (in background)
keep in mind that Ajax requests are asinchronic and clicking could be faster than loading and this should be predicted in logic... However this is just an idea