Accepting multiple date formats in rich:calendar

Version 1

    Hi,

    I had a problem in dealing with multiple date formats in richfaces calendar.

    In rich:calander component date format is required to accept a date in a particular pettern, but sometimes we may need to support multiple date patters and <rich:calendar does not allow to provide multiple date format.

    If we say enableManualInput="true" then we can enter any format but if format is not in proper way then, framwork will throw an error after validation phase.

     

    But this can be done by writing some javascript. In the javascript we shall check the required formats, and the value binding will also work properly.

     

    for this purpose one can use code like this in a rich:calendar component in the xhtml/jsp file.

    oninputkeypress="return acceptOnlyDateFields(event, this);"

    oninputblur="return validateDateValue(this, '#{messages['masha.date.validation.alert']}', '#{facesContext.viewRoot.locale}');"

    enableManualInput="true"

     

    Javascript code is here:

     

    function acceptOnlyDateFields(evt, obj){

        var flag = false;

        try{

            evt = (evt) ? evt : ((event) ? event : null);

            var keynumber = evt.keyCode;

            var dateValue = obj.value;

            var hasDateSeparator = false;

            keynumber = keynumber * 1;

            if(dateValue.length > 9 && keynumber != 13){

                //obj.value = obj.value.substring(0,10);

                return false;

            }   

            if((keynumber >= 48 && keynumber <=57) || keynumber == 190 || keynumber == 8 || keynumber == 46 || keynumber == 13){

                if(dateValue.length >6){

                    for(i = 0; i <dateValue.length ; i= i+1){

                        if(dateValue.charAt(i) == '.'){

                            hasDateSeparator = true;

                        }   

                    }

                    if(hasDateSeparator == false && dateValue.length == 7){

                        dateValue = dateValue.substring(0,2)+'.'+dateValue.substring(2,4)+'.'+dateValue.substring(4,7);

                        obj.value = dateValue;

                    }

                }   

                return true;

            }

            return false;

        }catch(e){}

        return false;

    }

     

     

    function validateDateValue(obj, alertMessage, locale){

        try{

            if(obj != null){

                var dateValue = obj.value;

                var hasDateSeparator = false;

                var numberOfDateSeparator = 0;

                var dateLength = 0;

                dateLength = dateValue.length;

                var firstDateSeparatorPos = 0;

                var secondDateSeparatorPos = 0;

                var invalidDate = false;

                var day = 0;

                var month = 0;

                var year = 0;

                for(i = 0; i <dateValue.length ; i= i+1){

                    if(dateValue.charAt(i) == '.'){

                        hasDateSeparator = true;

                        if(firstDateSeparatorPos == 0){

                            firstDateSeparatorPos = i;

                        }   

                        if(numberOfDateSeparator > 0 && secondDateSeparatorPos == 0){

                            secondDateSeparatorPos = i;

                        }   

                        numberOfDateSeparator = numberOfDateSeparator + 1;

                    }   

                }

                if((dateLength*1 < 8 || dateLength*1 > 10) && dateLength*1 > 0){

                    invalidDate = true;

                }else if(hasDateSeparator && dateLength == 8 && firstDateSeparatorPos != 1 && secondDateSeparatorPos != 3){

                    invalidDate = true;

                }else if(hasDateSeparator && dateLength == 9 && (firstDateSeparatorPos != 1 ||  firstDateSeparatorPos !=2) && secondDateSeparatorPos != 4){

                    invalidDate = true;

                }else if(hasDateSeparator && dateLength == 10 && firstDateSeparatorPos != 2 && secondDateSeparatorPos != 5){

                    invalidDate = true;

                }else if(hasDateSeparator == false && dateLength*1 > 0){

                    invalidDate = true;

                }   

                if(invalidDate){

                    alert(alertMessage);

                    //obj.value = '';

                    document.getElementById(obj.id).focus();

                    return false;

                }

     

                if(dateLength == 8 && firstDateSeparatorPos == 1 && secondDateSeparatorPos == 3){

                    day = parseInt(dateValue.substring(0,1),8);

                    month = parseInt(dateValue.substring(2,3),8);

                    year = parseInt(dateValue.substring(4,8));

                }else if(dateLength == 9 && firstDateSeparatorPos == 1 && secondDateSeparatorPos == 4){

                    day = parseInt(dateValue.substring(0,1));

                    month = parseInt(dateValue.substring(2,4));

                    year = parseInt(dateValue.substring(5,9));

                }else if(dateLength == 9 && firstDateSeparatorPos == 2 && secondDateSeparatorPos == 4){

                    day = parseInt(dateValue.substring(0,2));

                    month = parseInt(dateValue.substring(3,4));

                    year = parseInt(dateValue.substring(5,9));

                }else if(dateLength == 10 && firstDateSeparatorPos == 2 && secondDateSeparatorPos == 5){

                    day = parseInt(dateValue.substring(0,2));

                    month = parseInt(dateValue.substring(3,5));

                    year = parseInt(dateValue.substring(6,10));

                }else{

     

                }

                if(year == 0 && dateLength*1 > 0){

                    invalidDate = true;

                }else if((month  == 1 || month  == 3 || month  == 5 || month  == 7 || month  == 8 || month  == 10 || 12) && day > 31 && dateLength*1 > 0){

                    invalidDate = true;   

                }else if((month  == 4 || month  == 6 || month  == 9 || month  == 11) && day > 30 && dateLength*1 > 0){

                    invalidDate = true;

                }else if(month > 12 && dateLength*1 > 0){

                    invalidDate = true;

                }else if (month == 2 && dateLength*1 > 0){

                    var isLeap = new Date(year,1,29).getDate() == 29;

                    if(isLeap  && day > 29){

                        invalidDate = true;

                    }else if(isLeap == false && day > 28){

                        invalidDate = true;

                    }   

                }

                if(invalidDate){

                    alert(alertMessage);

                    //obj.value = '';

                    document.getElementById(obj.id).focus();

                    return false;

                }

            }   

     

        }catch(e){}

    }