Forum
11:57
08/11/2012
I have made the 3rd visible column (the one with added jqg_note class) auto height and I have a few rows at the start that are more than one line high. Problem is endless scroll does not show the last few rows. If I reverse the sort order, then all rows show.
Tried this on Chrome, Firefox and iPad, all showed the same bug.
I tried changing the jqgrid height, but no success.
CODE & DATA
<style type="text/css">
#notes_grid tr.jqgrow .jqg_note { /* Enable word wrap */
white-space: normal !important;
height:auto;
}
#notes_grid tr.jqgrow td { /* Cells align at top */
vertical-align:text-top;
padding-top:2px;
}
#notes_grid {font-size:1.2em !important;}
</style>
$("#notes_grid").jqGrid({
url:'frames/notes_list.php?job='+job_id,
datatype: 'json',
mtype: 'GET',
colNames:["id","user_id","User", "Date & Time", "Note"],
colModel:[ {name:'ID',index:'ID',width:1,hidden:true,key:true},
{name:'USER_ID',index:'USER_ID',width:1,hidden:true},
{name:'USERNAME',index:'USERNAME',width:100},
{name:'CREATE_DATE',index:'CREATE_DATE', width:150},
{name:'NOTE',index:'NOTE', width:432,sortable:false, classes:"jqg_note"} ],
rowNum:15,
height: 300,
forceFit: true,
gridview: true,
hidegrid: false, // Remove the hide button
scroll: true, // Endless scroll
hoverrows:false,
// Events
onCellSelect : function(rowid, index, contents, event) { if (rowid) fill_job_notes_details($(this).jqGrid('getCell', rowid, 'USER_ID')); },
ondblClickRow: function(rowid) { edit_note(rowid);}
});
JSON DATA:
{"page":"1","total":3,"records":"32","rows":[{"id":"1","cell":["1","1","Justin Levene","2012-08-07 10:14:38","This is Justin's first note..."]},{"id":"2","cell":["2",null,"Administrator","2012-08-07 10:14:38","This is an Admin note"]},{"id":"3","cell":["3","1","Justin Levene","2012-08-07 10:14:38","Another Justin note"]},{"id":"4","cell":["4","1","Justin Levene","2012-08-16 13:52:31","This should be the last note"]},{"id":"5","cell":["5",null,"Administrator","2012-08-16 14:32:55","Justin is watching me"]},{"id":"6","cell":["6","1","Justin Levene","2012-08-16 14:38:42","This is a test to see how long I can write for. I will write quite a bit of drivel and rubbish just to make this note quite large and long winded. God this is betting dull, but it is for a reason...."]},{"id":"7","cell":["7","1","Justin Levene","2012-08-16 14:40:10","This is a test hi"]},{"id":"8","cell":["8","1","Justin Levene","2012-08-16 14:42:26","Yet another note."]},{"id":"9","cell":["9","1","Justin Levene","2012-08-16 14:44:26","Just phoned Justin who said that I can take my invoice and shove it up my arse."]},{"id":"15","cell":["15","1","Justin Levene","2012-11-09 13:56:31","This should be the last note"]},{"id":"16","cell":["16","1","Justin Levene","2012-11-09 13:57:22","Ok I changed my mind and wanted to do a few more notes, so here goes. This is quite a long one so lets see how this one looks, I am not going for a record but you never know."]},{"id":"17","cell":["17","1","Justin Levene","2012-11-09 13:58:21","Another long note I think, this is so that I can test the scrolling and if I have a bug. I hate bugs, they give me so much grief and hardship, why can't coding just go without a hitch, hey ho, lets see."]},{"id":"18","cell":["18","1","Justin Levene","2012-11-09 13:58:43","Oh goody there was no bug. I am good you know"]},{"id":"19","cell":["19","1","Justin Levene","2012-11-09 13:59:14","This is note 14, I need to do over 20"]},{"id":"20","cell":["20","1","Justin Levene","2012-11-09 13:59:24","This is note 15"]}]}
12:02
08/11/2012
jqgrid seems to request data for non-vivible rows when they are shown. I wrote an infinate scroll and did the load request when a few rows before came into view, made it far more seamless, user wasn't looking at blank rows as it sort of predicted user wanted to see them and loaded them before user got there.
13:39
08/11/2012
Done some testing and found that the bug is due to the CSS "height:auto" on the row. jqgrid creates an empty void that when shown, requests data rows to fill it. The size of the void is calculated by the row height multiplyed row count, but it doesn't take into consideration some rows having a greater height. What has happened is that 30 rows have been loaded and filled the empty void, so there is no more empty void, thus no more requests are being made for data. I see why jqgrid uses this approach for when scroll:1, however this can be problematic in other ways as different browsers measure row heights in different ways (however jqgrid does leave a bit of extra space to account for this).
Possible bug fix solutions would be either:
- As row is loaded, check row height and add extra height to empty void if row height is larger than standard row. (this would keep the look and feel of jqgrid as it is now)
- Do as I mentioned in previous post, load data when a 1 or 2 rows before come into view. (This would make the scrolling more seamless)
- When scrolled to bottom or last row brought into view, if all rows haven't been loaded, do a load request even though there is no empty void space left. (Bit of a botch way of doing it)
- If empty void space is filled and all rows haven't been loaded, extend the empty void space height even more, an extra row height more than the table height would be enough. (Quick and easy way of fixing the bug, but can have problems if "scroll:1")
On the example posted, 32 rows of data are available, however the total of all row heights from the first 30 records is greater than the row height of 32, so no empty space is left and the last scroll request doesn't happen.
Out of all the bug fix options above, feel 4 is the easiest to implement, however 2 would be more seamless.
Most Users Ever Online: 715
Currently Online:
69 Guest(s)
Currently Browsing this Page:
1 Guest(s)
Top Posters:
OlegK: 1255
markw65: 179
kobruleht: 144
phicarre: 132
YamilBracho: 124
Renso: 118
Member Stats:
Guest Posters: 447
Members: 11373
Moderators: 2
Admins: 1
Forum Stats:
Groups: 1
Forums: 8
Topics: 10592
Posts: 31289
Newest Members:
, razia, Prankie, psky, praveen neelam, greg.valainis@pa-tech.comModerators: tony: 7721, Rumen[Trirand]: 81
Administrators: admin: 66