summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
-rw-r--r--index.html43
-rw-r--r--jquery-ui-timepicker-addon.js2
2 files changed, 44 insertions, 1 deletions
diff --git a/index.html b/index.html
index 493d454..833fa96 100644
--- a/index.html
+++ b/index.html
@@ -620,6 +620,49 @@ $('#slider_example_4').datetimepicker({
});</pre>
</div>
+ <!-- ============= example -->
+ <div class="example-container">
+ <p>Create your own control by implementing the create, options, and value methods. If you want to use your new control for all instances use the $.timepicker.setDefaults({controlType:myControl}). Here we implement jQueryUI's spinner control (jQueryUI 1.9+).</p>
+ <div>
+ <input type="text" name="slider_example_5" id="slider_example_5" value="" />
+ </div>
+<pre>var myControl= {
+ create: function(tp_inst, obj, unit, val, min, max, step){
+ $('&lt;input class="ui-timepicker-input" value="'+val+'" style="width:50%"&gt;')
+ .appendTo(obj)
+ .spinner({
+ min: min,
+ max: max,
+ step: step,
+ change: function(e,ui){ // key events
+ tp_inst._onTimeChange();
+ tp_inst._onSelectHandler();
+ },
+ spin: function(e,ui){ // spin events
+ tp_inst.control.value(tp_inst, obj, unit, ui.value);
+ tp_inst._onTimeChange();
+ tp_inst._onSelectHandler();
+ }
+ });
+ return obj;
+ },
+ options: function(tp_inst, obj, unit, opts, val){
+ if(typeof(opts) == 'string' && val !== undefined)
+ return obj.find('.ui-timepicker-input').spinner(opts, val);
+ return obj.find('.ui-timepicker-input').spinner(opts);
+ },
+ value: function(tp_inst, obj, unit, val){
+ if(val !== undefined)
+ return obj.find('.ui-timepicker-input').spinner('value', val);
+ return obj.find('.ui-timepicker-input').spinner('value');
+ }
+};
+
+$('#slider_example_5').datetimepicker({
+ controlType: myControl
+});</pre>
+ </div>
+
<h3 id="alt_examples">Alternate Fields</h3>
<!-- ============= example -->
diff --git a/jquery-ui-timepicker-addon.js b/jquery-ui-timepicker-addon.js
index f6b1c11..ab49c62 100644
--- a/jquery-ui-timepicker-addon.js
+++ b/jquery-ui-timepicker-addon.js
@@ -210,7 +210,7 @@
// controlType is string - key to our this._controls
if(typeof(tp_inst._defaults.controlType) === 'string'){
- if(tp_inst._defaults.controlType == 'slider' && $.fn.slider === undefined){
+ if($.fn[tp_inst._defaults.controlType] === undefined){
tp_inst._defaults.controlType = 'select';
}
tp_inst.control = tp_inst._controls[tp_inst._defaults.controlType];