Behavior |
API in Essential JS 1 |
API in Essential JS 2 |
CSS Class
|
Property: CssClass
$("#timepicker").ejTimePicker({
cssClass :'gradient-lime'
});
|
Property: CssClass
var timepicker = new ej.calendars.TimePicker({
cssClass: 'e-custom-style'
});
timepicker.appendTo('#element');
|
Popup list customization
|
Not Applicable
|
Event: itemRender
var timepicker = new ej.calendars.TimePicker({
itemRender: itemRanderHandler
});
timepicker.appendTo('#element');
function itemRenderHandler(args) { }
|
Show/Hide the popup button
|
Property: showPopupButton
$("#timepicker").ejTimePicker({
showPopupButton : false
});
|
Can be achieved by
var timepicker = new ej.calendars.TimePicker({
focus: onFocus
});
timepicker.appendTo('#element');
function onFocus(args){
timepicker.show();
}
.e-control-wrapper .e-input-group-icon.e-time-icon {
display: none;
}
|
Enable/Disable the rounded corner
|
Property: showRoundedCorner
$("#timepicker").ejTimePicker({
showRoundedCorner : true
});
|
Can be achieved by
var timepicker = new ej.calendars.TimePicker({
cssClass: 'e-custom-style'
});
timepicker.appendTo('#element');
.e-control-wrapper.e-custom-style.e-time-wrapper.e-input-group {
border-radius: 4px;
}
|
Enable/Disable the animation
|
Property: enableAnimation
$("#timepicker").ejTimePicker({
enableAnimation : true
});
|
Not Applicable
|
Interval
|
Property: interval
$("#timepicker").ejTimePicker({
interval : 120
});
|
Property: step
var timepicker = new ej.calendars.TimePicker({
step: 120
});
timepicker.appendTo('#element');
|
FocusIn event
|
Event: focusIn
$("#timepicker").ejTimePicker({
focusIn: function (args) {}
});
|
Event: focus
var timepicker = new ej.calendars.TimePicker({
focus: onFocus
});
timepicker.appendTo('#element');
function onFocus(args){ }
|
FocusOut event
|
Event: focusOut
$("#timepicker").ejTimePicker({
focusIn: function (args) {}
});
|
Event: blur
var timepicker = new ej.calendars.TimePicker({
blur: onBlur
});
timepicker.appendTo('#element');
function onBlur(args) { }
|
FocusIn method
|
Not Applicable
|
Method: focusIn()
var timepicker = new ej.calendars.TimePicker({
value : new Date()
});
timepicker.appendTo('#element');
timepicker.focusIn();
|
FocusOut method
|
Not Applicable
|
Event: focusOut
var timepicker = new ej.calendars.TimePicker({
value : new Date()
});
timepicker.appendTo('#element');
timepicker.focusOut();
|
Prevent popup close
|
Not Applicable
|
Event: close
var timepicker = new ej.calendars.TimePicker({
close: function (args: PreventableEventArgs) {
args.cancel = true;
}
});
timepicker.appendTo('#element');
timepicker.show();
|
Prevent popup open
|
Not Applicable
|
Event: open
var timepicker = new ej.calendars.TimePicker({
open: function (args) {
args.cancel = true;
}
});
timepicker.appendTo('#element');
timepicker.show();
|