I've done some rudementary searching for a topic that would lead me to a good solution, but I have not found any so far. I was hoping Bytes might lead me to glory!
I built my own "pop up calendar" script.
It creates a table that has hyperlinks inside cells which, once clicked, will populate a textbox with a preformatted date.
It positions the table absolutely at the mouse coordinates when a particular image is clicked.
The goal I am now trying to accomplish is: when the table is showing on the screen (i.e. the table element exists in the DOM) should the user click on anything BUT the table, the table element is destroyed).
I've tried using on onBlur() on the table, and automatically focus()'ing on the table at its creation. This works until the user tries to click the hyperlinks in the cells, at which point the onBlur fires before the click event for the hyperlink. So, no bueno.
I tried creating an event listener at the document level which listens for a click event on anything that isn't the table (or the original element that spawns the table)... but the problem with that is if the user tries to click on the links which scroll between months in my calendar, it'll disappear!
Can anyone think of a simple solution that I am missing?
I built my own "pop up calendar" script.
It creates a table that has hyperlinks inside cells which, once clicked, will populate a textbox with a preformatted date.
It positions the table absolutely at the mouse coordinates when a particular image is clicked.
The goal I am now trying to accomplish is: when the table is showing on the screen (i.e. the table element exists in the DOM) should the user click on anything BUT the table, the table element is destroyed).
I've tried using on onBlur() on the table, and automatically focus()'ing on the table at its creation. This works until the user tries to click the hyperlinks in the cells, at which point the onBlur fires before the click event for the hyperlink. So, no bueno.
I tried creating an event listener at the document level which listens for a click event on anything that isn't the table (or the original element that spawns the table)... but the problem with that is if the user tries to click on the links which scroll between months in my calendar, it'll disappear!
Can anyone think of a simple solution that I am missing?
Comment