Skip to content

Commit f3bd620

Browse files
eternicodeeternicode
committed
Extend data-api to all picker types, enact on click event, add tests
1 parent 2d768a6 commit f3bd620

4 files changed

Lines changed: 129 additions & 14 deletions

File tree

‎js/bootstrap-datepicker.js‎

Lines changed: 13 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1141,11 +1141,19 @@
11411141
/* DATEPICKER DATA-API
11421142
* ================== */
11431143

1144-
$(document).on('focus.datepicker.data-api', '[data-provide="datepicker"]', function(e){
1145-
var $this = $(this);
1146-
if ($this.data('datepicker')) return;
1147-
e.preventDefault();
1148-
$this.datepicker($this.data());
1144+
$(document).on(
1145+
'focus.datepicker.data-api click.datepicker.data-api',
1146+
'[data-provide="datepicker"]',
1147+
function(e){
1148+
var $this = $(this);
1149+
if ($this.data('datepicker')) return;
1150+
e.preventDefault();
1151+
// component click requires us to explicitly show it
1152+
$this.datepicker('show');
1153+
}
1154+
);
1155+
$(function(){
1156+
$('[data-provide="datepicker-inline"]').datepicker();
11491157
});
11501158

11511159
}( window.jQuery );

‎tests/suites/data-api.js‎

Lines changed: 114 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,114 @@
1+
module('DATA-API');
2+
3+
test('DATA-API: data-provide="datepicker" on input; focus', function(){
4+
var input = $('<input data-provide="datepicker" />')
5+
.appendTo('#qunit-fixture');
6+
input.focus();
7+
ok(input.data('datepicker'), 'datepicker is initialized by "focus" event');
8+
});
9+
10+
test('DATA-API: data-provide="datepicker" on input; click', function(){
11+
var input = $('<input data-provide="datepicker" />')
12+
.appendTo('#qunit-fixture');
13+
input.click();
14+
ok(input.data('datepicker'), 'datepicker is initialized by "focus" event');
15+
});
16+
17+
test('DATA-API: data-provide="datepicker" on component', function(){
18+
var html, comp;
19+
20+
html = '<div class="input-append date" data-provide="datepicker">'+
21+
'<input><span class="add-on"><i class="icon-th"></i></span>'+
22+
'</div>';
23+
24+
comp = $(html).appendTo('#qunit-fixture');
25+
comp.find('input').focus();
26+
ok(comp.data('datepicker'), 'append component initialized by "focus" event on input');
27+
comp.remove();
28+
29+
comp = $(html).appendTo('#qunit-fixture');
30+
comp.find('input').click();
31+
ok(comp.data('datepicker'), 'append component initialized by "click" event on input');
32+
comp.remove();
33+
34+
comp = $(html).appendTo('#qunit-fixture');
35+
comp.find('.add-on').focus();
36+
ok(comp.data('datepicker'), 'append component initialized by "focus" event on add-on');
37+
comp.remove();
38+
39+
comp = $(html).appendTo('#qunit-fixture');
40+
comp.find('.add-on').click();
41+
ok(comp.data('datepicker'), 'append component initialized by "click" event on add-on');
42+
comp.remove();
43+
44+
45+
html = '<div class="input-prepend date" data-provide="datepicker">'+
46+
'<span class="add-on"><i class="icon-th"></i></span><input>'+
47+
'</div>';
48+
49+
comp = $(html).prependTo('#qunit-fixture');
50+
comp.find('input').focus();
51+
ok(comp.data('datepicker'), 'prepend component initialized by "focus" event on input');
52+
comp.remove();
53+
54+
comp = $(html).prependTo('#qunit-fixture');
55+
comp.find('input').click();
56+
ok(comp.data('datepicker'), 'prepend component initialized by "click" event on input');
57+
comp.remove();
58+
59+
comp = $(html).prependTo('#qunit-fixture');
60+
comp.find('.add-on').focus();
61+
ok(comp.data('datepicker'), 'prepend component initialized by "focus" event on add-on');
62+
comp.remove();
63+
64+
comp = $(html).prependTo('#qunit-fixture');
65+
comp.find('.add-on').click();
66+
ok(comp.data('datepicker'), 'prepend component initialized by "click" event on add-on');
67+
comp.remove();
68+
});
69+
70+
test('DATA-API: data-provide="datepicker" on button', function(){
71+
var html, comp;
72+
73+
html = '<button data-provide="datepicker">';
74+
75+
comp = $(html).appendTo('#qunit-fixture');
76+
comp.focus();
77+
ok(comp.data('datepicker'), 'button initialized by "focus" event on input');
78+
comp.remove();
79+
80+
comp = $(html).appendTo('#qunit-fixture');
81+
comp.click();
82+
ok(comp.data('datepicker'), 'button initialized by "click" event on input');
83+
comp.remove();
84+
});
85+
86+
test('DATA-API: data-provide="datepicker" on rangepicker', function(){
87+
var html, comp;
88+
89+
html = '<div class="input-daterange" data-provide="datepicker">'+
90+
'<input class="datepicker">'+
91+
'<span class="add-on">to</span>'+
92+
'<input class="datepicker">'+
93+
'</div>';
94+
95+
comp = $(html).appendTo('#qunit-fixture');
96+
comp.find('input:first').focus();
97+
ok(comp.data('datepicker'), 'range initialized by "focus" event on first input');
98+
comp.remove();
99+
100+
comp = $(html).appendTo('#qunit-fixture');
101+
comp.find('input:first').click();
102+
ok(comp.data('datepicker'), 'range initialized by "click" event on first input');
103+
comp.remove();
104+
105+
comp = $(html).appendTo('#qunit-fixture');
106+
comp.find('input:last').focus();
107+
ok(comp.data('datepicker'), 'range initialized by "focus" event on last input');
108+
comp.remove();
109+
110+
comp = $(html).appendTo('#qunit-fixture');
111+
comp.find('input:last').click();
112+
ok(comp.data('datepicker'), 'range initialized by "click" event on last input');
113+
comp.remove();
114+
});

‎tests/suites/options.js‎

Lines changed: 0 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -283,11 +283,3 @@ test('DaysOfWeekDisabled', function(){
283283
target = picker.find('.datepicker-days tbody td:nth(26)');
284284
ok(target.hasClass('disabled'), 'Day of week is disabled');
285285
});
286-
287-
test('DATA-API: data-provide="datepicker"', function(){
288-
var input = $('<input data-provide="datepicker" />')
289-
.appendTo('#qunit-fixture');
290-
input.focus();
291-
ok(input.data('datepicker'), 'datepicker is initialized by "focus" event');
292-
});
293-

‎tests/tests.html‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -35,6 +35,7 @@
3535
<script src="suites/options.js"></script>
3636
<script src="suites/inline.js"></script>
3737
<script src="suites/calendar-weeks.js"></script>
38+
<script src="suites/data-api.js"></script>
3839
</head>
3940
<body>
4041
<h1 id="qunit-header">bootstrap-datepicker</h1>
@@ -44,4 +45,4 @@ <h2 id="qunit-userAgent"></h2>
4445
<ol id="qunit-tests"></ol>
4546
<div id="qunit-fixture"></div>
4647
</body>
47-
</html>
48+
</html>

0 commit comments

Comments
 (0)