Expand my Community achievements bar.

Submissions are now open for the 2026 Adobe Experience Maker Awards.

Mark Solution

This conversation has been locked due to inactivity. Please create a new post.

SOLVED

Using xtype datefield not to select past date in CQ5

Avatar

Former Community Member

Please help me how to set minvalue as current date in xtype datefield.

1 Accepted Solution

Avatar

Correct answer by
Level 2

You need to write custom js and listeners to implement this.

(1) Create a js function to compare dates:\

/**
*Compares dates and return values in 0,-1,1,2
**/
MyUtility.compareDate = function(a_dateOne ,a_dateTwo)
{                       var returnVal = 'default';
                        var l_dateOne;
                        var l_dateTwo;
                            l_dateOne = a_dateOne.split('/');
                            l_dateTwo = a_dateTwo.split('/');                      
                        if(l_dateOne[2] == l_dateTwo[2] && l_dateOne[1] == l_dateTwo[1] && l_dateOne[0] == l_dateTwo[0]){
                            returnVal = 0;
                        }
                        else if(l_dateOne[2] > l_dateTwo[2]){
                            returnVal = 1 ;
                        }else if(l_dateOne[2] == l_dateTwo[2]){
                            if(l_dateOne[1] > l_dateTwo[1]){
                                returnVal = 1;
                            }else if(l_dateOne[1] == l_dateTwo[1]){
                                if(l_dateOne[0] > l_dateTwo[0]){
                                    returnVal = 1;
                                }else{
                                    returnVal = -1;
                                }
                            }else{
                                returnVal = -1;
                            }
                        }else{
                            returnVal = -1;
                        }
                        return returnVal;
}

(2) Call this function using CQ listeners beforeSubmit event.

function(){
var currentDate = new Date();
currentDate=currentDate.format("d/m/y");
var eventDate=this.findByType('datefield')[0].getDateValue();
var event_year = new Date(eventDate).getFullYear();
var current_year = new Date(currentDate).getFullYear();

if(currentDate!=null)
{
    eventDate=eventDate.format("d/m");
    currentDate=currentDate.format("d/m");
    eventDate = eventDate.concat("/"+event_year);
    currentDate = currentDate.concat("/"+current_year);
    var l_expirationDateCheck=MyUtility.compareDate(eventDate,currentDate);
    if(l_expirationDateCheck==1)
                    {
                     var msg = CQ.I18n.getMessage("Selected Date cannot be less than current date");
                        CQ.Ext.Msg.show({
                            "title": CQ.I18n.getMessage("Error Message"),
                            "msg": msg,
                            "buttons": CQ.Ext.Msg.OK
                        });
                        return false;
                    }
}
}

View solution in original post

5 Replies

Avatar

Correct answer by
Level 2

You need to write custom js and listeners to implement this.

(1) Create a js function to compare dates:\

/**
*Compares dates and return values in 0,-1,1,2
**/
MyUtility.compareDate = function(a_dateOne ,a_dateTwo)
{                       var returnVal = 'default';
                        var l_dateOne;
                        var l_dateTwo;
                            l_dateOne = a_dateOne.split('/');
                            l_dateTwo = a_dateTwo.split('/');                      
                        if(l_dateOne[2] == l_dateTwo[2] && l_dateOne[1] == l_dateTwo[1] && l_dateOne[0] == l_dateTwo[0]){
                            returnVal = 0;
                        }
                        else if(l_dateOne[2] > l_dateTwo[2]){
                            returnVal = 1 ;
                        }else if(l_dateOne[2] == l_dateTwo[2]){
                            if(l_dateOne[1] > l_dateTwo[1]){
                                returnVal = 1;
                            }else if(l_dateOne[1] == l_dateTwo[1]){
                                if(l_dateOne[0] > l_dateTwo[0]){
                                    returnVal = 1;
                                }else{
                                    returnVal = -1;
                                }
                            }else{
                                returnVal = -1;
                            }
                        }else{
                            returnVal = -1;
                        }
                        return returnVal;
}

(2) Call this function using CQ listeners beforeSubmit event.

function(){
var currentDate = new Date();
currentDate=currentDate.format("d/m/y");
var eventDate=this.findByType('datefield')[0].getDateValue();
var event_year = new Date(eventDate).getFullYear();
var current_year = new Date(currentDate).getFullYear();

if(currentDate!=null)
{
    eventDate=eventDate.format("d/m");
    currentDate=currentDate.format("d/m");
    eventDate = eventDate.concat("/"+event_year);
    currentDate = currentDate.concat("/"+current_year);
    var l_expirationDateCheck=MyUtility.compareDate(eventDate,currentDate);
    if(l_expirationDateCheck==1)
                    {
                     var msg = CQ.I18n.getMessage("Selected Date cannot be less than current date");
                        CQ.Ext.Msg.show({
                            "title": CQ.I18n.getMessage("Error Message"),
                            "msg": msg,
                            "buttons": CQ.Ext.Msg.OK
                        });
                        return false;
                    }
}
}

Avatar

Level 10

Avatar

Level 10

The following AEM topics discuss this subject:

http://dev.day.com/docs/en/cq/current/developing/widgets/xtypes.html

http://dev.day.com/docs/en/cq/current/widgets-api/index.html?class=CQ.Ext.form.DateField

To learn how to build a component using xtypes and hook that into the sidekick - please see this community article:

http://helpx.adobe.com/adobe-cq/kb/creating-cq-widget-supports-image.html

hope this helps you

Avatar

Former Community Member

Thanks Sham HC for your help.

But I want to write javascript under listeners node based on xtype datefield. (not on datetime xtype).

Avatar

Former Community Member

JavaScript code:Xtype Datefield
                            validator="function(){var curDate = new Date();var enterDate=new Date(this.value);var dd1 = enterDate.getDate();var mm1 = enterDate.getMonth()+1;var yyyy1 =enterDate.getFullYear();var newdate1 = mm1 + '/' + dd1 + '/' + yyyy1;var enterNewDate=new Date(newdate1);var curdd=curDate.getDate();var curmm=curDate.getMonth()+1;var curyy=curDate.getFullYear();var currentFmtDate=curmm+'/'+curdd+'/'+curyy;var currentNewDate=new Date(currentFmtDate);return (currentNewDate<= enterNewDate);}"