#9573 closed bug (fixed)

Opened September 25, 2013 08:26PM UTC

Closed September 27, 2013 06:23PM UTC

Last modified November 26, 2013 08:45PM UTC

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>

Attachments (0)

Change History (8)

Changed September 25, 2013 09:13PM UTC by tj.vantoll comment:1

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/.

Changed September 27, 2013 02:46PM UTC by scottgonzalez comment:2

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

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.

Changed September 27, 2013 03:42PM UTC by tj.vantoll comment:3

Replying to [comment:2 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.

Changed September 27, 2013 05:58PM UTC by tj.vantoll comment:4

Pull request: https://github.com/jquery/jquery-ui/pull/1091

Changed September 27, 2013 06:23PM UTC by TJ VanToll comment:5

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

Changed September 27, 2013 06:23PM UTC by tj.vantoll comment:6

milestone:	none → 1.11.0

Changed November 26, 2013 08:12PM UTC by TJ VanToll comment:7