scroller plugin scroll table with keypress

visceralist

Hi

I asked this question elsewhere but I think it may have been too general. I am using the scroller plugin and I want to know how to scroll the table up/down using keyboward keydown event; i've got the events wired up, I just don't know the syntax for scroller API.

I tried doing this:

[code]
this.myTable.dataTable({
"sScrollY": "200px",
"sDom": "frtiS",
"bDeferRender": true,
"fnInitComplete": function () {
this.fnSettings().oScroller.fnScrollToRow(1000);
}
});
[/code]

but i get Cannot call method 'dataTable' of undefined error message with that. so basically I need to be able to hit arrow down on the page (without click inside the table first) and scroll down about 30px and scroll up when I hit the arrow up.

any info would help.
thanks

allan

> but i get Cannot call method 'dataTable' of undefined error message with that.

Can you show me a test page showing that error please? I don't understand why hat would be happening with the above code.

Allan

visceralist

I read somewhere that that error happens if the datatable is initialized already in the page; above that code, earlier in the page on my loadsuccesscallback function, I am initializing the datatable:

[code]
this.tableAccounts.dataTable({
"sScrollY": "400px",
"aaData": tableData,
"sDom": "tiS",
"bDeferRender": true...
[/code]

and I am sorry man, I know this would have been a lot simpler if I could link a page but its behind the damn firewall. :(

visceralist

here's the jsFiddle of how it looks so far:

http://jsfiddle.net/visceral/Qymnv/1/

"aaData": tableData, is where data coming from the db.

allan

If you look at your browser's console, you'll see that you have a syntax error here:

[code]
$(document).bind('keydown', function (event) {
PageDown) {

$(".dataTables_scrollBody").scrollTop(200);
}
});
[/code]

(second line).

Have a look at this Fiddle http://jsfiddle.net/CN4UZ/5/ - original source: http://stackoverflow.com/questions/8681162/intercept-pageup-pagedown-keydown-events-in-chrome-browser .

Allan

visceralist

sorry about that man that was my bad.. the first portion of that code looks like this:

[code]
$(document).bind('keydown', function (event) {

if (event.keyCode === KeyCodes.PageDown) {
$(".dataTables_scrollBody").scrollTop(50);
}
});
[/code]
with that I don't see any console errors; it scrolls the page down quickly and goes back to the top of the table. I added event.stoppropogation(); right after where I am calling the scrollTop(), but that didn't do much either.

allan

As I noted - you need to make the `50` a computed value - otherwise, obviously, it is always just going to scroll to 50 px. Get the current scroll position and then add or subtract a suitable value as needed, then apply that.

I would also say, imho, that intercepting the page up / down button and having them do something that the user isn't expecting is a fairly bad idea. More or less no other page on the web does that, so they won't realise what is going on until they think about it.

visceralist

I am going to refactor to consider your first paragraph, and I certainly agree with the second paragraph as well; I am going to see if I can change some people's mind on that request.

cheers mate, you've been quite helpful.