I've derived this from the sample code for a timespinner at http://jqueryui.com/spinner/. I can't get it to work.
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery UI Spinner - Time</title>
<script src="/jquery-2.1.0.min.js"></script>
<script src="/jquery-ui-1.11.2/jquery-ui.min.js"></script>
<script src="/resources/jquery-mousewheel-master/jquery.mousewheel.js"></script>
<script src="/resources/globalize-1.0.0-alpha.10/dist/globalize.js"></script>
<script>
$.widget( "ui.timespinner", $.ui.spinner, {
options: { step: 60 * 1000, page: 60 },
_parse: function( value ) {
if ( typeof value === "string" ) {
if ( Number( value ) == value ) {
return Number( value );
}
return +Globalize.parseDate( value );
}
return value;
},
_format: function( value ) {
return Globalize.format( new Date(value), "t" );
}
});
$(function() {
$( "#spinner" ).timespinner();
$( "#culture" ).change(function() {
var current = $( "#spinner" ).timespinner( "value" );
Globalize.culture( $(this).val() );
$( "#spinner" ).timespinner( "value", current );
});
});
</script>
</head>
<body>
<p> <label for="spinner">Time spinner:</label> <input id="spinner" name="spinner" value="08:30 PM"> </p>
<p>
<label for="culture">Select a culture to use for formatting:</label>
<select id="culture">
<option value="en-EN" selected="selected">English</option>
<option value="de-DE">German</option>
</select>
</p>
<div class="demo-description">
<p>
A custom widget extending spinner. Use the Globalization plugin to parse and output
a timestamp, with custom step and page options. Cursor up/down spins minutes, page up/down
spins hours.
</p>
</div>
</body>
</html>
In Chrome, I get: Uncaught TypeError: undefined is not a function
In Firefox, I get: TypeError: Globalize.parsedate is not a function
Both are on the line, return +Globalize.parseDate( value );.
All of the locations of scripts in script tags are correct. I get no other error. The up/down arrows for the spinner are missing.
Am I missing a script?
First off your script should never be in your head. You should always load it below your dom because loading a script blocks rendering the page. See https://developers.google.com/speed/docs/insights/BlockingJS for more information on it. I copied your code as best I could and had no issues. I would suggest looking at your globalize file. I used CDN's for all the files I loaded and used the http://cdnjs.com/libraries/globalize for the globalize.js file. So double check your globalize.js or provide a link so I can look at it. Hope that helps.