[FIX] web_widget_numeric_step: no input focus on touch screens

If you're using a tablet and click on the  or  buttons created by this module, the result was that the numeric input related to that button got focused.

On tablets, that means that the on-screen keyboard pops up. This usually triggers a layout recalculation and becomes clunky. Besides, it's useless, because if you wanted to use the keyboard, you'd have clicked on the input by yourself, and not in one of those buttons.

After this change, when using a touch screen, if you click on the +/- buttons, you won't auto-focus on the input. Thus, the keyboard won't show up.

@moduon MT-4472
This commit is contained in:
Jairo Llopis
2023-12-22 11:29:14 +00:00
committed by Carlos Roca
parent 0d3ab6c305
commit 714d7abb00
4 changed files with 7 additions and 4 deletions

View File

@@ -366,7 +366,7 @@ ul.auto-toc {
!! This file is generated by oca-gen-addon-readme !!
!! changes will be overwritten. !!
!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
!! source digest: sha256:404b377c03eeead0eb7b1dd03b17ecff3a4b72aff56decfdccd33e5bbcf1b8b5
!! source digest: sha256:cc3d79cf1592294e77da78edc530b91ddfc931abe8f31a361b65ae2f197537b5
!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! -->
<p><a class="reference external image-reference" href="https://odoo-community.org/page/development-status"><img alt="Beta" src="https://img.shields.io/badge/maturity-Beta-yellow.png" /></a> <a class="reference external image-reference" href="http://www.gnu.org/licenses/agpl-3.0-standalone.html"><img alt="License: AGPL-3" src="https://img.shields.io/badge/licence-AGPL--3-blue.png" /></a> <a class="reference external image-reference" href="https://github.com/OCA/web/tree/16.0/web_widget_numeric_step"><img alt="OCA/web" src="https://img.shields.io/badge/github-OCA%2Fweb-lightgray.png?logo=github" /></a> <a class="reference external image-reference" href="https://translation.odoo-community.org/projects/web-16-0/web-16-0-web_widget_numeric_step"><img alt="Translate me on Weblate" src="https://img.shields.io/badge/weblate-Translate%20me-F47D42.png" /></a> <a class="reference external image-reference" href="https://runboat.odoo-community.org/builds?repo=OCA/web&amp;target_branch=16.0"><img alt="Try me on Runboat" src="https://img.shields.io/badge/runboat-Try%20me-875A7B.png" /></a></p>
<p>This widget changes input number field and make it easier to increment the number thanks to 2 buttons (+ and -).

View File

@@ -4,6 +4,7 @@ import {registry} from "@web/core/registry";
import {standardFieldProps} from "@web/views/fields/standard_field_props";
import {_lt} from "@web/core/l10n/translation";
import {FloatField} from "@web/views/fields/float/float_field";
import {hasTouch} from "@web/core/browser/feature_detection";
export class NumericStep extends FloatField {
setup() {
@@ -11,7 +12,9 @@ export class NumericStep extends FloatField {
}
_onStepClick(ev) {
const $el = $(ev.target).parent().parent().find("input");
$el.focus();
if (!hasTouch()) {
$el.focus();
}
const mode = $(ev.target).data("mode");
this._doStep(mode);
}