Skip to content

Commit f53d0e3

Browse files
longbilllongbill
committed
fix bugs
1 parent a0b2201 commit f53d0e3

File tree

4 files changed

+143
-94
lines changed

4 files changed

+143
-94
lines changed

‎daterangepicker.css‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -88,7 +88,7 @@
8888
line-height:1;
8989
font-size:12px;
9090
margin-bottom:1px;
91-
color:#999;
91+
color: #ccc;
9292
cursor:default;
9393
}
9494
.date-picker-wrapper .month-wrapper table div.day.lastMonth,

‎demo.js‎

Lines changed: 16 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -276,7 +276,7 @@ $(function()
276276
showShortcuts: false
277277
});
278278

279-
$('#date-range14-2').dateRangePicker(
279+
$('#date-range14-2').dateRangePicker(
280280
{
281281
batchMode: 'week-range',
282282
showShortcuts: false
@@ -388,7 +388,8 @@ $(function()
388388

389389
$('#date-range5-2').dateRangePicker(
390390
{
391-
maxDays:3
391+
minDays:3,
392+
maxDays:7
392393
});
393394

394395
$('#date-range24').dateRangePicker(
@@ -423,5 +424,18 @@ $(function()
423424
selectBackward: true
424425
});
425426

427+
$('#hotel-booking').dateRangePicker(
428+
{
429+
startDate: new Date(),
430+
selectForward: true,
431+
beforeShowDay: function(t)
432+
{
433+
var valid = !(t.getDay() == 0 || t.getDay() == 6); //disable saturday and sunday
434+
var _class = '';
435+
var _tooltip = valid ? '' : 'sold out';
436+
return [valid,_class,_tooltip];
437+
}
438+
});
439+
426440

427441
});

‎index.html‎

Lines changed: 27 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -131,11 +131,12 @@ <h2>Demonstrations</h2>
131131
</div>
132132

133133
<div class="demo">
134-
Limit date range selected within 3 days: <input id="date-range5-2" size="40" value="">
134+
Limit date range selected between 3 days to 7 days: <input id="date-range5-2" size="40" value="">
135135
<a href="#" class="show-option">Show Config</a>
136136
<pre class="options">
137137
{
138-
maxDays: 3
138+
maxDays: 7,
139+
minDays: 3
139140
} </pre>
140141
</div>
141142

@@ -559,6 +560,30 @@ <h2>Demonstrations</h2>
559560
}</pre>
560561
</div>
561562

563+
<div class="demo">
564+
Typical usage, hotel booking: <input id="hotel-booking" size="60" value="">
565+
<a href="#" class="show-option">Show Config</a>
566+
<pre class="options">
567+
{
568+
startDate: new Date(),
569+
selectForward: true,
570+
showDateFilter: function(time, date)
571+
{
572+
return '&lt;div style="padding:0 5px;">\
573+
&lt;span style="font-weight:bold">'+date+'&lt;/span>\
574+
&lt;div style="opacity:0.3;">$'+Math.round(Math.random()*999)+'&lt;/div>\
575+
&lt;/div>';
576+
},
577+
beforeShowDay: function(t)
578+
{
579+
var valid = !(t.getDay() == 0 || t.getDay() == 6); //disable saturday and sunday
580+
var _class = '';
581+
var _tooltip = valid ? '' : 'sold out';
582+
return [valid,_class,_tooltip];
583+
}
584+
} </pre>
585+
</div>
586+
562587

563588
<h2>Configuration</h2>
564589
<pre><b>Usage:</b> $('#dom-id').dateRangePicker(configObject);</pre>

‎jquery.daterangepicker.js‎

Lines changed: 99 additions & 89 deletions
Original file line numberDiff line numberDiff line change
@@ -1270,17 +1270,40 @@
12701270

12711271
function isValidTime(time)
12721272
{
1273+
time = parseInt(time, 10);
12731274
if (opt.startDate && compare_day(time, opt.startDate) < 0) return false;
12741275
if (opt.endDate && compare_day(time, opt.endDate) > 0) return false;
12751276

12761277
if (opt.start && !opt.end && !opt.singleDate)
12771278
{
1279+
//check maxDays and minDays setting
12781280
if (opt.maxDays > 0 && countDays(time, opt.start) > opt.maxDays) return false;
12791281
if (opt.minDays > 0 && countDays(time, opt.start) < opt.minDays) return false;
12801282

1283+
//check selectForward and selectBackward
12811284
if (opt.selectForward && time < opt.start ) return false;
12821285
if (opt.selectBackward && time > opt.start) return false;
1286+
1287+
//check disabled days
1288+
if (opt.beforeShowDay && typeof opt.beforeShowDay == 'function')
1289+
{
1290+
var valid = true;
1291+
var timeTmp = time;
1292+
while( countDays(timeTmp, opt.start) > 1 )
1293+
{
1294+
var arr = opt.beforeShowDay( new Date(timeTmp) );
1295+
if (!arr[0])
1296+
{
1297+
valid = false;
1298+
break;
1299+
}
1300+
if (timeTmp > opt.start) timeTmp -= 86400000;
1301+
if (timeTmp < opt.start) timeTmp += 86400000;
1302+
}
1303+
if (!valid) return false;
1304+
}
12831305
}
1306+
return true;
12841307
}
12851308

12861309

@@ -1289,29 +1312,9 @@
12891312
box.find('.day.invalid.tmp').removeClass('tmp invalid').addClass('valid');
12901313
if (opt.start && !opt.end)
12911314
{
1292-
var time = opt.start;
1293-
var firstInvalid = 0, lastInvalid = 143403840000000; //a really large number
1294-
box.find('.day.toMonth.invalid').not('.tmp').each(function()
1295-
{
1296-
var _time = parseInt($(this).attr('time'));
1297-
if (_time > time && _time < lastInvalid)
1298-
{
1299-
lastInvalid = _time;
1300-
}
1301-
else if (_time < time && _time > firstInvalid)
1302-
{
1303-
firstInvalid = _time;
1304-
}
1305-
});
1306-
13071315
box.find('.day.toMonth.valid').each(function()
13081316
{
1309-
var time = parseInt($(this).attr('time'));
1310-
if ( time <= firstInvalid || time >= lastInvalid)
1311-
{
1312-
$(this).addClass('invalid').addClass('tmp').removeClass('valid');
1313-
}
1314-
1317+
var time = parseInt($(this).attr('time'), 10);
13151318
if (!isValidTime(time))
13161319
$(this).addClass('invalid tmp').removeClass('valid');
13171320
else
@@ -1325,90 +1328,97 @@
13251328

13261329
function dayHovering(day)
13271330
{
1328-
if (day.hasClass('invalid')) return;
13291331
var hoverTime = parseInt(day.attr('time'));
1332+
var tooltip = '';
13301333

1331-
if (opt.singleDate)
1334+
if (day.hasClass('has-tooltip') && day.attr('data-tooltip'))
13321335
{
1333-
box.find('.day.hovering').removeClass('hovering');
1334-
day.addClass('hovering');
1336+
tooltip = '<span style="white-space:nowrap">'+day.attr('data-tooltip')+'</span>';
13351337
}
1336-
else
1338+
else if (!day.hasClass('invalid'))
13371339
{
1338-
box.find('.day').each(function()
1340+
if (opt.singleDate)
13391341
{
1340-
var time = parseInt($(this).attr('time')),
1341-
start = opt.start,
1342-
end = opt.end;
1343-
1344-
if ( time == hoverTime )
1345-
{
1346-
$(this).addClass('hovering');
1347-
}
1348-
else
1349-
{
1350-
$(this).removeClass('hovering');
1351-
}
1352-
1353-
if (
1354-
( opt.start && !opt.end )
1355-
&&
1356-
(
1357-
( opt.start < time && hoverTime >= time )
1358-
||
1359-
( opt.start > time && hoverTime <= time )
1360-
)
1361-
)
1362-
{
1363-
$(this).addClass('hovering');
1364-
}
1365-
else
1366-
{
1367-
$(this).removeClass('hovering');
1368-
}
1369-
});
1370-
1371-
if (opt.start && !opt.end)
1342+
box.find('.day.hovering').removeClass('hovering');
1343+
day.addClass('hovering');
1344+
}
1345+
else
13721346
{
1373-
var days = countDays(hoverTime, opt.start);
1374-
var tooltip = '';
1375-
if (opt.hoveringTooltip)
1347+
box.find('.day').each(function()
13761348
{
1377-
if (typeof opt.hoveringTooltip == 'function')
1349+
var time = parseInt($(this).attr('time')),
1350+
start = opt.start,
1351+
end = opt.end;
1352+
1353+
if ( time == hoverTime )
13781354
{
1379-
tooltip = opt.hoveringTooltip(days, opt.start, hoverTime);
1355+
$(this).addClass('hovering');
13801356
}
1381-
else if (opt.hoveringTooltip === true && days > 1)
1357+
else
13821358
{
1383-
tooltip = days + ' ' + lang('days');
1359+
$(this).removeClass('hovering');
13841360
}
1385-
}
1386-
if (tooltip)
1387-
{
1388-
var posDay = day.offset();
1389-
var posBox = box.offset();
1390-
1391-
var _left = posDay.left - posBox.left;
1392-
var _top = posDay.top - posBox.top;
1393-
_left += day.width()/2;
1394-
13951361

1396-
var $tip = box.find('.date-range-length-tip');
1397-
var w = $tip.css({'visibility':'hidden', 'display':'none'}).html(tooltip).width();
1398-
var h = $tip.height();
1399-
_left -= w/2;
1400-
_top -= h;
1401-
setTimeout(function()
1362+
if (
1363+
( opt.start && !opt.end )
1364+
&&
1365+
(
1366+
( opt.start < time && hoverTime >= time )
1367+
||
1368+
( opt.start > time && hoverTime <= time )
1369+
)
1370+
)
14021371
{
1403-
$tip.css({left:_left, top:_top, display:'block','visibility':'visible'});
1404-
},10);
1405-
}
1406-
else
1372+
$(this).addClass('hovering');
1373+
}
1374+
else
1375+
{
1376+
$(this).removeClass('hovering');
1377+
}
1378+
});
1379+
1380+
if (opt.start && !opt.end)
14071381
{
1408-
box.find('.date-range-length-tip').hide();
1382+
var days = countDays(hoverTime, opt.start);
1383+
if (opt.hoveringTooltip)
1384+
{
1385+
if (typeof opt.hoveringTooltip == 'function')
1386+
{
1387+
tooltip = opt.hoveringTooltip(days, opt.start, hoverTime);
1388+
}
1389+
else if (opt.hoveringTooltip === true && days > 1)
1390+
{
1391+
tooltip = days + ' ' + lang('days');
1392+
}
1393+
}
14091394
}
14101395
}
14111396
}
1397+
1398+
if (tooltip)
1399+
{
1400+
var posDay = day.offset();
1401+
var posBox = box.offset();
1402+
1403+
var _left = posDay.left - posBox.left;
1404+
var _top = posDay.top - posBox.top;
1405+
_left += day.width()/2;
1406+
1407+
1408+
var $tip = box.find('.date-range-length-tip');
1409+
var w = $tip.css({'visibility':'hidden', 'display':'none'}).html(tooltip).width();
1410+
var h = $tip.height();
1411+
_left -= w/2;
1412+
_top -= h;
1413+
setTimeout(function()
1414+
{
1415+
$tip.css({left:_left, top:_top, display:'block','visibility':'visible'});
1416+
},10);
1417+
}
1418+
else
1419+
{
1420+
box.find('.date-range-length-tip').hide();
1421+
}
14121422
}
14131423

14141424
function clearHovering()
@@ -2094,7 +2104,7 @@
20942104
var highlightToday = moment(today.time).format('L') == moment(now).format('L');
20952105
today.extraClass = '';
20962106
today.tooltip = '';
2097-
if(opt.beforeShowDay && typeof opt.beforeShowDay == 'function')
2107+
if(today.valid && opt.beforeShowDay && typeof opt.beforeShowDay == 'function')
20982108
{
20992109
var _r = opt.beforeShowDay(moment(today.time).toDate());
21002110
today.valid = _r[0];
@@ -2105,7 +2115,7 @@
21052115

21062116
todayDivAttr = {
21072117
time: today.time,
2108-
title: today.tooltip,
2118+
'data-tooltip': today.tooltip,
21092119
'class': 'day '+today.type+' '+today.extraClass+' '+(today.valid ? 'valid' : 'invalid')+' '+(highlightToday?'real-today':'')
21102120
};
21112121

0 commit comments

Comments
 (0)