jQuery UI Spinner doesn't show dollar sign with currency designation

jquery, jquery-ui, spinner

Solution

You need a culture specified and also need to include the Globalize library.

Link to the appropriate culture you're using in your app and specify it in your code and add a reference to the globalise.js file.

The example links to `<script src="/resources/demos/external/globalize.js"></script>`

$("#amount").spinner({ culture: "en-US", min: min, max: max, step: 10, start: 10, numberFormat: "C", spin: updateAmounts }).change(updateAmounts);

Problem

I am using jQuery UI's new spinner widget. Here is the init/config: ``` $(function() { $("#amount").spinner({ min: min, max: max, step: 10, start: 10, numberFormat: "C", spin: updateAmounts }).change(updateAmounts); )}; //min=5; max=500 ``` The spinner works fine, except for one thing. Even though I define `numberFormat` as "C" (currency), it does not show a dollar sign like the demo does. The spinner itself shows up, I can spin it up and down and it follows the specified max and min, but no dollar sign. I tried putting a dollar sign in the value in the HTML textbox as well as the jQuery UI `start` option, but no dice. I thought it might be because of the function I assigned to the `spin` event (`updateAmounts`, as you can see above), but removing that event handler changed nothing. I also tried making the textbox itself as basic as possible (removed a `style` and `maxlength` attribute I had on it), but no dice. I've done some searching on this, but I couldn't come up with anything, partially because the spinner is new, and partially because the words "dollar sign" confuse things, what with jQuery's use of it. Here's the HTML code for the textbox: ``` <input id="amount" name="amount" value="10" maxlength="4"> ``` I'm using jQuery UI version 1.9.0 and jQuery 1.8.2.

Original source