diff options
-rw-r--r-- | index.html | 43 | ||||
-rw-r--r-- | jquery-ui-timepicker-addon.js | 2 |
2 files changed, 44 insertions, 1 deletions
@@ -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){ + $('<input class="ui-timepicker-input" value="'+val+'" style="width:50%">') + .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];
|