如何在jquery UI日期选择器中动态设置最小和最大日期 [英] How to Set minimum and maximum date dynamically in jquery UI date picker

问题描述

我在我的日期选择器上方有一个下拉菜单，基于此下拉列表中选择的年份，我想将我的最小日期和最大日期限制为我的下一个日期时间选择器控件



比如说：我选择2013年至2014年的下拉，基于此我按照我的逻辑创建逻辑日期，比如开始日期将是

I have one drop down above my datepicker , based on year selected in this drop down i want to restrict my min date and max date into my next date time picker control

say for example : dropdown i choosed 2013 - 2014 , based on this i am creating logical dates as per my logic , say start date would be

2014-07-23
and end date 2015-07-22

所以现在我的月份和年份应该在日期选择器的这两个日期之间

so now my month and year should be between these two dates from date picker

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.min.js"></script>
<link rel="stylesheet" type="text/css" media="screen" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/themes/base/jquery-ui.css" />
<script>
    var jQuery_1_10_2 = $.noConflict(true);
</script>

lang="cs"> $(function () {
       debugger;
       jQuery_1_10_2("#<%=txtReviewStartDate.ClientID%>").datepicker({
           changeMonth: true,
           changeYear: true,
           showButtonPanel: true,
           minDate: new Date('2014-07-23'),
           maxDate: new Date('2015-07-22'),
           autoclose: true,
           dateFormat: 'MM yy',
           onClose: function (dateText, inst) {
               var month = jQuery_1_10_2("#ui-datepicker-div .ui-datepicker-month :selected").val();
               var year = jQuery_1_10_2("#ui-datepicker-div .ui-datepicker-year :selected").val();
               jQuery_1_10_2(this).datepicker('setDate', new Date(year, month, 1));
               jQuery_1_10_2(this).blur();
           }
       });
   });

这是我试过的远，我只使用月份和年份，没有日期

this is what i have tried so far , i am using only month and year , there are no dates

推荐答案

.noConflict（true）;
< / script >

.noConflict(true); </script>

lang="cs">

（ function（）{
debugger;
jQuery_1_10_2（＃<％= txtReviewStartDate.ClientID％>）。datepicker（{
changeMonth：true，
changeYear：true，
showButtonPanel：true，
minDate：new Date（'2014-07-23'），
maxDate：new Date（'2015-07-22'），
autoclose： true，
dateFormat：'MM yy'，
onClose：function（dateText，inst）{
var month = jQuery_1_10_2（＃ui-datepicker-div .ui-datepicker-month：selected ）.val（）;
var year = jQuery_1_10_2（＃ui-datepicker-div .ui-datepicker-year：selected）。val（）;
jQuery_1_10_2（this）.datepicker（' setDate'，new Date（year，month，1））;
jQuery_1_ 10_2（本）.blur（）;
}
}）;
}）;

(function () { debugger; jQuery_1_10_2("#<%=txtReviewStartDate.ClientID%>").datepicker({ changeMonth: true, changeYear: true, showButtonPanel: true, minDate: new Date('2014-07-23'), maxDate: new Date('2015-07-22'), autoclose: true, dateFormat: 'MM yy', onClose: function (dateText, inst) { var month = jQuery_1_10_2("#ui-datepicker-div .ui-datepicker-month :selected").val(); var year = jQuery_1_10_2("#ui-datepicker-div .ui-datepicker-year :selected").val(); jQuery_1_10_2(this).datepicker('setDate', new Date(year, month, 1)); jQuery_1_10_2(this).blur(); } }); });

这是我试过的远，我只使用月份和年份，没有日期

this is what i have tried so far , i am using only month and year , there are no dates

你可以这样做： http://api.jqueryui.com/datepicker/#option-yearRange [ ^ ]



请参阅： http://jsfiddle.net/w9fwL/11/ [ ^ ]



对于你提到的情况你可以设置 yearRange： - 1。这将仅提供2014年和2015年的年度选择。



问候..

You can do it this way : http://api.jqueryui.com/datepicker/#option-yearRange[^]

See this : http://jsfiddle.net/w9fwL/11/[^]

For the case you have mentioned you can set yearRange: "-1". That will provide year selection only for 2014 and 2015.

Regards..

这篇关于如何在jquery UI日期选择器中动态设置最小和最大日期的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！