Opened 7 years ago

Closed 7 years ago

Last modified 6 years ago

#9573 closed bug (fixed)

Spinner: forces a field validation in Firefox before field loses focus or form is submitted

Reported by: johnneed Owned by:
Priority: minor Milestone: 1.10.4
Component: ui.spinner Version: 1.10.3
Keywords: Cc:
Blocked by: Blocking:

Description

Bug found in the following environment:

jQuery-ui-1.10.3

jQuery-1.10.2

Firefox 23.0.1 (all add-on's disabled)

Given a textbox with the attribute required='required', after the ui-spinner is applied, the :invalid pseudo class styles are applied before the field loses focus or the submit button is clicked.

In other words, there's a big honkin' red error box around the spinner right after the page loads.

This behavior is only found in Firefox. Chrome does not exhibit this behavior. Most likely because Chrome does not validate a required field after losing focus.

This bug was validated using the following markup. 

<!DOCTYPE html>
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <title>Spinner Bug</title>     
    </head>
    <body>
        <form>
		<input name='textbox' type='text' required='required'/><br/>
		<input name='spinner' class='spinner' type='text' required='required'/><br/>
		<input type='submit' value='submit'/>
		</form>
        <script src="js/vendor/jquery-1.10.2.min.js"></script>
		<script src="js/jquery-ui-1.10.3.custom/js/jquery-ui-1.10.3.custom.js"></script>
        <script>
            $(document).ready(function(){
				$(".spinner").spinner();
			});
        </script>
    </body>
</html>

Change History (8)

comment:1 Changed 7 years ago by tj.vantoll

Status: new → open
Summary: ui.spinner forces a field validation in Firefox before field loses focus or form is submitted → Spinner: forces a field validation in Firefox before field loses focus or form is submitted

This is Firefox's :-moz-ui-invalid psuedo-class: ​https://developer.mozilla.org/en-US/docs/Web/CSS/:-moz-ui-invalid

I'm not sure what specifically spinner is doing for Firefox's algorithm to think the field has been interacted with.

Test case: ​http://jsfiddle.net/tj_vantoll/Z2jbx/.

comment:2 Changed 7 years ago by Scott González

This happens because during creation, we format the value according to the numberFormat and culture options. I think we either need to not format on creation, or only format if there is a value.

Last edited 7 years ago by Scott González (previous) (diff)

comment:3 in reply to:  2 Changed 7 years ago by tj.vantoll

Replying to scott.gonzalez:

This happens because during creation, we format the value according to the numberFormat and culture options. I think we either need to not format on creation, or only format if there is a value.

I would think we would still have to format on creation, and we could still do that without causing problems here.

Only formatting if there is a value seems simple enough and should solve this.

comment:5 Changed 7 years ago by TJ VanToll

Resolution: → fixed
Status: open → closed

Spinner: Only format the value when there is one. Fixes #9573 - Spinner: forces a field validation in Firefox before field loses focus or form is submitted

Changeset: e6360ab846c6d0248d6013d005d2c178906ca692

comment:6 Changed 7 years ago by tj.vantoll

Milestone: none → 1.11.0

comment:7 Changed 6 years ago by TJ VanToll

Spinner: Only format the value when there is one. Fixes #9573 - Spinner: forces a field validation in Firefox before field loses focus or form is submitted (cherry picked from commit e6360ab846c6d0248d6013d005d2c178906ca692)

Changeset: b846bea0fde6b14f63194450e4a77693c3a039a2

comment:8 Changed 6 years ago by Scott González

Milestone: 1.11.0 → 1.10.4
Note: See TracTickets for help on using tickets.