archive-gh-me/bootstrap-datepicker
1
0
Fork 0
mirror of https://github.com/uxsolutions/bootstrap-datepicker.git synced 2026-01-18 15:53:54 +00:00
Code Issues Projects Releases Wiki Activity

Extend data-api to all picker types, enact on click event, add tests

Browse Source
This commit is contained in:
Andrew Rowls 2013-04-04 15:23:03 -04:00
parent 2d768a6871
commit f3bd620cc7
4 changed files with 129 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
js/bootstrap-datepicker.js vendored
View File

@ -1141,11 +1141,19 @@
/* DATEPICKER DATA-API
* ================== */
$(document).on('focus.datepicker.data-api', '[data-provide="datepicker"]', function(e){
var $this = $(this);
if ($this.data('datepicker')) return;
e.preventDefault();
$this.datepicker($this.data());
$(document).on(
'focus.datepicker.data-api click.datepicker.data-api',
'[data-provide="datepicker"]',
function(e){
var $this = $(this);
if ($this.data('datepicker')) return;
e.preventDefault();
// component click requires us to explicitly show it
$this.datepicker('show');
}
);
$(function(){
$('[data-provide="datepicker-inline"]').datepicker();
});
}( window.jQuery );

114
tests/suites/data-api.js Normal file
View File

@ -0,0 +1,114 @@
module('DATA-API');
test('DATA-API: data-provide="datepicker" on input; focus', function(){
var input = $('<input data-provide="datepicker" />')
.appendTo('#qunit-fixture');
input.focus();
ok(input.data('datepicker'), 'datepicker is initialized by "focus" event');
});
test('DATA-API: data-provide="datepicker" on input; click', function(){
var input = $('<input data-provide="datepicker" />')
.appendTo('#qunit-fixture');
input.click();
ok(input.data('datepicker'), 'datepicker is initialized by "focus" event');
});
test('DATA-API: data-provide="datepicker" on component', function(){
var html, comp;
html = '<div class="input-append date" data-provide="datepicker">'+
'<input><span class="add-on"><i class="icon-th"></i></span>'+
'</div>';
comp = $(html).appendTo('#qunit-fixture');
comp.find('input').focus();
ok(comp.data('datepicker'), 'append component initialized by "focus" event on input');
comp.remove();
comp = $(html).appendTo('#qunit-fixture');
comp.find('input').click();
ok(comp.data('datepicker'), 'append component initialized by "click" event on input');
comp.remove();
comp = $(html).appendTo('#qunit-fixture');
comp.find('.add-on').focus();
ok(comp.data('datepicker'), 'append component initialized by "focus" event on add-on');
comp.remove();
comp = $(html).appendTo('#qunit-fixture');
comp.find('.add-on').click();
ok(comp.data('datepicker'), 'append component initialized by "click" event on add-on');
comp.remove();
html = '<div class="input-prepend date" data-provide="datepicker">'+
'<span class="add-on"><i class="icon-th"></i></span><input>'+
'</div>';
comp = $(html).prependTo('#qunit-fixture');
comp.find('input').focus();
ok(comp.data('datepicker'), 'prepend component initialized by "focus" event on input');
comp.remove();
comp = $(html).prependTo('#qunit-fixture');
comp.find('input').click();
ok(comp.data('datepicker'), 'prepend component initialized by "click" event on input');
comp.remove();
comp = $(html).prependTo('#qunit-fixture');
comp.find('.add-on').focus();
ok(comp.data('datepicker'), 'prepend component initialized by "focus" event on add-on');
comp.remove();
comp = $(html).prependTo('#qunit-fixture');
comp.find('.add-on').click();
ok(comp.data('datepicker'), 'prepend component initialized by "click" event on add-on');
comp.remove();
});
test('DATA-API: data-provide="datepicker" on button', function(){
var html, comp;
html = '<button data-provide="datepicker">';
comp = $(html).appendTo('#qunit-fixture');
comp.focus();
ok(comp.data('datepicker'), 'button initialized by "focus" event on input');
comp.remove();
comp = $(html).appendTo('#qunit-fixture');
comp.click();
ok(comp.data('datepicker'), 'button initialized by "click" event on input');
comp.remove();
});
test('DATA-API: data-provide="datepicker" on rangepicker', function(){
var html, comp;
html = '<div class="input-daterange" data-provide="datepicker">'+
'<input class="datepicker">'+
'<span class="add-on">to</span>'+
'<input class="datepicker">'+
'</div>';
comp = $(html).appendTo('#qunit-fixture');
comp.find('input:first').focus();
ok(comp.data('datepicker'), 'range initialized by "focus" event on first input');
comp.remove();
comp = $(html).appendTo('#qunit-fixture');
comp.find('input:first').click();
ok(comp.data('datepicker'), 'range initialized by "click" event on first input');
comp.remove();
comp = $(html).appendTo('#qunit-fixture');
comp.find('input:last').focus();
ok(comp.data('datepicker'), 'range initialized by "focus" event on last input');
comp.remove();
comp = $(html).appendTo('#qunit-fixture');
comp.find('input:last').click();
ok(comp.data('datepicker'), 'range initialized by "click" event on last input');
comp.remove();
});

8
tests/suites/options.js
View File

@ -283,11 +283,3 @@ test('DaysOfWeekDisabled', function(){
target = picker.find('.datepicker-days tbody td:nth(26)');
ok(target.hasClass('disabled'), 'Day of week is disabled');
});
test('DATA-API: data-provide="datepicker"', function(){
var input = $('<input data-provide="datepicker" />')
.appendTo('#qunit-fixture');
input.focus();
ok(input.data('datepicker'), 'datepicker is initialized by "focus" event');
});

3
tests/tests.html
View File

@ -35,6 +35,7 @@
<script src="suites/options.js"></script>
<script src="suites/inline.js"></script>
<script src="suites/calendar-weeks.js"></script>
<script src="suites/data-api.js"></script>
</head>
<body>
<h1 id="qunit-header">bootstrap-datepicker</h1>
@ -44,4 +45,4 @@
<ol id="qunit-tests"></ol>
<div id="qunit-fixture"></div>
</body>
</html>
</html>