themesberg / themesberg/flowbite

Bug: Number input Control buttons min value doesn't allow typing

Open
#926 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
HTML
Stars
9.4k
Forks
862
PR merge metrics
No merged PRs in 30d

Description

When using the Input Number with control buttons, I am unable to type a value smaller than the data-input-counter-min value, as it always reverts to the minimum value. Consequently, it is not possible to type a number larger than the minimum value if it starts with a digit less than the data-input-counter-min.

To reproduce this behavior, use the following input:

<input type="text" id="bedrooms-input" data-input-counter data-input-counter-min="5" data-input-counter-max="100" value="10" required />

When attempting to type a number between 10 and 49, the value changes back to 5 before I can finish typing.

I believe this behavior is due to an onInput() event that changes the value before I complete typing. It would be ideal to modify this event to an onchange() or an onblur() event, allowing the verification to wait until the user finishes typing the desired number before validating it.

image

  • Browser: [e.g. Chrome]
  • Flowbite Version: 2.4.1

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by reproducing the issue with the provided input using Flowbite 2.4.1, then trace the Input Number control's onInput() handling. Confirm that values beginning below the minimum can be completed without being reset, and verify that control-button min/max validation still works.

Written by the indexing model from the issue text.

Assessment

Tech stack
html, javascript
Domain
frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
42/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.