开发者

How to disable dates before current date in jsdatepicker

I am using jsdatepicker to display calendar.

http://javascriptcalendar.org/javascript-date-picker.php

function initialize()

{
        new JsDatePick({
                    useMode:2,
            limitToToday :false, 
            target:"deadlinedate",
            dat开发者_JAVA百科eFormat:"%d-%m-%Y"
            });
}

Is there any way to disable all dates before current date. Any help would be appreciated.

Thanks


download the full version not the min one and change the JsDatePick.prototype.isAvailable function > for < in all 3 ifs


You can add startDate and finishDate parameters to jsDatePick. There is a "limitToToday" control statement in this library (jsDatePick.full.1.x.js) and you can add 2 control statement after this statement, like this:

if (this.oConfiguration.limitToToday){
    if ( ! this.isAvailable(this.currentYear, this.currentMonth, parseInt(oDay.getDate()) - 1 ) ){
        disabledDayFlag = true;
        aDayDiv.setAttribute("isJsDatePickDisabled",1);
    }
}

// Your startDate method

if (this.oConfiguration.startDate != ''){
    startDate2 = new Date(Date.parse(this.oConfiguration.startDate));

    if ( (oDay.getFullYear() < startDate2.getFullYear()) ||
         (oDay.getFullYear() == startDate2.getFullYear() && oDay.getMonth() < startDate2.getMonth()) ||
         (oDay.getFullYear() == startDate2.getFullYear() && oDay.getMonth() == startDate2.getMonth() && oDay.getDate() < startDate2.getDate() )
        )
    {
        disabledDayFlag = true;
        aDayDiv.setAttribute("isJsDatePickDisabled",1);
    }
}

// Your finisDate method

if (this.oConfiguration.finishDate != ''){
    finishDate2 = new Date(Date.parse(this.oConfiguration.finishDate));

    if ( (oDay.getFullYear() > finishDate2.getFullYear()) ||
         (oDay.getFullYear() == finishDate2.getFullYear() && oDay.getMonth() > finishDate2.getMonth()) ||
         ( oDay.getFullYear() == finishDate2.getFullYear() && oDay.getMonth() == finishDate2.getMonth() && oDay.getDate() > finishDate2.getDate() )
        )
    {
        disabledDayFlag = true;
        aDayDiv.setAttribute("isJsDatePickDisabled",1);
    }
}

You should update "JsDatePick.prototype.setConfiguration" :

JsDatePick.prototype.setConfiguration = function(aConf){
    this.oConfiguration.isStripped      = (aConf["isStripped"] != null) ? aConf["isStripped"] : false;
    this.oConfiguration.useMode         = (aConf["useMode"] != null) ? aConf["useMode"] : 1;
    this.oConfiguration.selectedDate    = (aConf["selectedDate"] != null) ? aConf["selectedDate"] : null;
    this.oConfiguration.target          = (aConf["target"] != null) ? aConf["target"] : null;
    this.oConfiguration.yearsRange      = (aConf["yearsRange"] != null) ? aConf["yearsRange"] : [1971,2100];
    this.oConfiguration.limitToToday    = (aConf["limitToToday"] != null) ? aConf["limitToToday"] : false;
    this.oConfiguration.field           = (aConf["field"] != null) ? aConf["field"] : false;
    this.oConfiguration.cellColorScheme = (aConf["cellColorScheme"] != null) ? aConf["cellColorScheme"] : "ocean_blue";
    this.oConfiguration.dateFormat      = (aConf["dateFormat"] != null) ? aConf["dateFormat"] : "%m-%d-%Y";
    this.oConfiguration.imgPath         = (g_jsDatePickImagePath.length != null) ? g_jsDatePickImagePath : "img/";
    this.oConfiguration.weekStartDay    = (aConf["weekStartDay"] != null) ? aConf["weekStartDay"] : 1;
    **this.oConfiguration.startDate     = (aConf["startDate"] != null) ? aConf["startDate"] : '';
    this.oConfiguration.finishDate      = (aConf["finishDate"] != null) ? aConf["finishDate"] : '';**
....
}

When you create your DatePicker object:

g_globalObject = new JsDatePick({
    useMode:1,
    isStripped:true,
    target:"div_calendar",
    startDate:"05.01.2013",
    finishDate:"05.31.2013"
    });


EDIT:

Read it wrong, you have to set the minimum date for that in your option:

var options = {minDate:'03/18/2011',maxDate:today}
$("#datestart").datepicker(options);
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜