Prevent non-numeric input in contesting-serial fields

[DJ3CE]

Firefox allows non-numeric input in type=number-inputs. This PR adds/modifies code to prevent this by checking the codepoint of the keyboardEvent.

[patrickrb]

Your code is generally correct and will prevent non-numeric input. However, there are a few potential issues to consider:

Accessibility: Some users might use the keyboard to navigate, and your current code would prevent the use of keys like Tab, Backspace, and Arrow keys. You might want to allow these keys.

Copy and Paste: Users can still paste non-numeric characters into the input field. If you want to prevent this, you'll need to handle the paste event.

Non-Standard Keys: Some keyboards might have non-standard keys that produce a character code less than 48 or greater than 57. This is rare, but it's something to keep in mind.

$('#exch_serial_r, #exch_serial_s').on('keypress', function (e) {
    var charCode = (e.which) ? e.which : e.keyCode;
    if (!(/[0-9]/.test(String.fromCharCode(charCode))) && 
        !(charCode == 8 || charCode == 9 || charCode == 37 || charCode == 39)) {
        return false;
    }
}).on('paste', function (e) {
    var pasteData = e.originalEvent.clipboardData.getData('text');
    if (pasteData.match(/[^0-9]/)) {
        e.preventDefault();
    }
});

This version allows the Tab (9), Backspace (8), Left Arrow (37), and Right Arrow (39) keys. It also prevents pasting non-numeric characters.

[DJ3CE]

Thanks for putting focus on accessibility, although all mentioned keys and pasting did work in Firefox as well as in Chrome in my tests. Which browser did you use?

The numpad-keys e.g. may have different keyCodes and that's why the code does not test on keyCode or which, but on the UTF-16 codepoint given by charCodeAt of key.

[patrickrb]

It was just pseudo code again, didn't test it. I'll see if I can get it working today

[patrickrb]

Doh! i thought this PR was changing the exchange not the serial. It looks like the serial inputs are both number type and shouldn't allow alpha characters on modern browsers. Which browser are you using that allowed alpha characters?

One thing i did notice is we can add emojis in the exchange 😲

[github-actions]

Uh oh! @patrickrb, the image you shared is missing helpful alt text. Check #3023 (comment).

Alt text is an invisible description that helps screen readers describe images to blind or low-vision users. If you are using markdown to display images, add your alt text inside the brackets of the markdown image.

Learn more about alt text at Basic writing and formatting syntax: images on GitHub Docs.

[DJ3CE]

Thanks for your feedback. I have changed the title to avoid confusion, which fields are meant.

I could enter arbitrary data with Firefox into the 'numbers'-field, which got discarded without any mention.

Do I understand it right, that issues with control-keys weren't experienced but assumed by you? Again: I can not reproduce issues with control keys.

p.s. Uh yeah! I'd definitly go for a smiley in one of my next signal reports ;).

[magicbug]

I didnt give much thought for emjoiis being added!