Scrolling in input fields issue

naresh11381
(@naresh11381)

1 year, 3 months ago

Hi,
You recently updated the plugin to remove the scrolling arrows within input fields ref: https://wordpress.org/support/topic/arrows-in-inputs/.

After testing, it looks the same bug still exists. If you click in an input and fill out your credit number and then scroll up or down, it will change the number, in many siutations without the use knowing.

To replicate the issue using a mouse click in the input and scroll up or down while the cursor is still in the input. If you move the cursor so it is not over the input the issue does not happen. But obviously users will not know this.

Having numbers change when scrolling is very unusual and problematic. Especially as we still get charged each time this happens.

Is possible to remove this as it is causing issues and something I have never seen on a payment form?

I think this is related and may help > https://gist.github.com/barbietunnie/121e98d66838c90ff7993ebd99fe3310

Thanks again

Nik

Viewing 1 replies (of 1 total)

Thread Starter

(@naresh11381)

This code works. You may want to integrate something into the plugin directly.

document.addEventListener('DOMContentLoaded', function () {
    document.addEventListener('focus', function (event) {
        if (event.target.matches('input[type=number]')) {
            event.target.addEventListener('wheel', preventScroll, { passive: false });
        }
    }, true);

    document.addEventListener('blur', function (event) {
        if (event.target.matches('input[type=number]')) {
            event.target.removeEventListener('wheel', preventScroll);
        }
    }, true);

    function preventScroll(event) {
        event.preventDefault();
    }
});

Viewing 1 replies (of 1 total)

The topic ‘Scrolling in input fields issue’ is closed to new replies.