显示日历中的有限天数

show limited days in calendar

本文关键字:日历 显示      更新时间:2023-09-26

下面是我尝试的代码。

From:<input data-dojo-id="myFromDate" type="text" name="fromDate" id="fromDate" value="" data-dojo-type="dijit/form/DateTextBox" required="true" constraints="{ datePattern: 'MM/dd/yyyy'}"  onChange="myToDate.constraints.min = arguments[0];"/> 
 To:<input data-dojo-id="myToDate" type="text" name="toDate" id="toDate" value="" data-dojo-type="dijit/form/DateTextBox" required="true" constraints="{ datePattern: 'MM/dd/yyyy'}" onChange="myFromDate.constraints.max = arguments[0];" />
 <input type="submit" value="submit"/>

请建议我如何在"fromDate"字段中选择日期后仅启用未来90天,如果在"toDate"字段选择日期则启用过去90天。

我建议您使用dojo/date进行Date操作,而使用dijit/form/DateTextBox用于向CCD_ 3小部件添加约束的约束。

例如

<label for="fromDate">From:</label> 
    <input id="fromDate" data-dojo-type="dijit/form/DateTextBox"
                        data-dojo-props='type:"text", name:"fromDate", required:true,
                        onChange:function(){ 
                            var fromDate = this.get("value");
                            var fromDate90 = dojo.date.add(fromDate,"day",90);
                            //Add min date fromDate.
                            dijit.byId("toDate").constraints.min = fromDate;
                            //add max date  fromDate + 90 days.
                            dijit.byId("toDate").constraints.max = fromDate90; 
                        } '/>
    <label for="toDate">To:</label> 
    <input id="toDate" data-dojo-type="dijit/form/DateTextBox"
                       data-dojo-props='type:"text", name:"toDate", required:true,
                        onChange:function(){
                            var toDate = this.get("value");
                            var toDate90 = dojo.date.add(toDate,"day",-90);
                            //Add max date toDate.
                            dijit.byId("fromDate").constraints.max = toDate;
                            //Add min date toDate - 90 days. 
                            dijit.byId("fromDate").constraints.min = toDate90;
                        } '/>