[Seaside] JavaScript keypress events

Tim Johnson digit at sonic.net
Sun Jan 22 19:29:00 UTC 2023


Hi Seasiders,

I'm beginning to use Seaside's JavaScript integrations a bit.  I've 
avoided JavaScript all these years, but I think it's necessary for my 
current project.  The project will use the computer/phone keyboard 
for interaction.

I've had my first success by attaching an event listener to keydown as 
follows:

renderContentOn: html

 	html document addLoadScript: ( (html jQuery this) onKeyDown: ( 
html javascript logger log: 'keydown' ) ) .



I understand this is about as basic as it gets, but I'm still overjoyed at 
this success.  Interacting with the keyboard in a web app is something 
I've wanted to do for years.

The next steps for me would be to:

1) print what the keycode is, in the console log above, instead of just 
'keydown'.  How could I get event details in a snippet like the above?  Is 
this possible without AJAX or writing raw JavaScript?

2) My app will need to know which element on the page is being 'hovered' 
over or has focus when the keypress event arrives.  I can imagine a few 
possible ways of doing this...

2a) I may need to add <input> tags on my page, so when one gets 
tapped/activated by someone using the app on a phone, the keyboard will 
pop up.  The <input> tag/element could then be what is listening for 
keydown/keyup/keypress events, instead of the base document.  (But I don't 
want actual text input boxes.)

2b) using jQuery to search the DOM for the element that current has hover 
and/or focus


I'll need to move on to AJAX and passengers next.  Unfortunately the 
documentation[1] on these subjects seems to remain unwritten.  Searching 
the mailing list might be the best way to learn...?  I also appreciate the 
"jQuery Functional Test Suite" in the image, but am sometimes wishing for 
something more... (I am open to the idea of writing down my adventures as 
potential help to others, as a potential #webruary project...)

[1] older homes of book: https://book.seaside.st/book/web-20/jquery/ajax
https://rmod-files.lille.inria.fr/FreeBooks/SeasideBook/2014-07-16-seaside.pdf

newer home of book:

https://github.com/SquareBracketAssociates/DynamicWebDevelopmentWithSeaside/releases/tag/continuous



Appreciate any help or insight from folks on the list.

Thanks,
Tim



More information about the seaside mailing list