EasyUI Forum
February 23, 2018, 05:32:02 PM *
Welcome, Guest. Please login or register.

Login with username, password and session length
News:
 
   Home   Help Search Login Register  
Pages: [1]
  Print  
Author Topic: calendar + keyboard  (Read 383 times)
roberto
Newbie
*
Posts: 38


View Profile Email
« on: November 05, 2017, 07:17:33 PM »

Hi,
Is it possible to select a date with the enter key and navigate with arrows, pgup, pgdn, etc.?
Logged
jarry
Administrator
Hero Member
*****
Posts: 1303


View Profile Email
« Reply #1 on: November 06, 2017, 08:45:53 AM »

Here is the simple extended method to achieve this functionality.
Code:
(function($){
function navigate(target){
var opts = $(target).calendar('options');
function navDate(step){
var date = opts.current;
if (date) {
date = new Date(date.getFullYear(), date.getMonth(), date.getDate() + step);
} else {
date = new Date();
}
$(target).calendar('moveTo', date);
}
$(target).attr('tabindex',1).bind('keydown', function(e){
switch(e.which){
case 38:
navDate(-7);
return false;
case 40:
navDate(7);
return false;
case 37:
navDate(-1);
return false;
case 39:
navDate(1);
return false;
}

})
}
$.extend($.fn.calendar.methods, {
nav: function(jq){
return jq.each(function(){
navigate(this);
})
}
})
})(jQuery);

Usage example:
Code:
$('#cc').calendar('nav');
Logged
roberto
Newbie
*
Posts: 38


View Profile Email
« Reply #2 on: November 06, 2017, 05:44:35 PM »

 Smiley tank you!
Logged
Pages: [1]
  Print  
 
Jump to:  

Powered by MySQL Powered by PHP Powered by SMF 1.1.18 | SMF © 2013, Simple Machines Valid XHTML 1.0! Valid CSS!