Java World: Java Scripts

Lets suppose we have a html page with three text boxes.
In one text box user has to enter the date in MM/DD/YYYY . Once foucs is lost in first text field ,m then Seccond text field is populated as "Input date+ 14" .
Third text field should be populated as "Input date+ 15
Even date validation should happen for input date.

For ex:-   If input date entered is "01/01/1995" (MM/DD/YYYY)
Then second text field is populates as "01/15/1995" (MM/DD/YYYY)
Third text field populates as "01/29/1995" (MM/DD/YYYY).

Lets see the program how this is achieved.

<%--
    Document   : adddate
    Adding days to input date
    Author     : murali
--%>
<html>
    <body>
        <script>
            function addDays(currDate,days)
            {
                var dateSplit = currDate.split("/");
                var dateInput = new Date( parseInt(dateSplit[2], 10),
                parseInt(dateSplit[0], 10)-1,
                parseInt(dateSplit[1], 10)
            );
                dateInput.setDate(dateInput.getDate() + days);
                var res = ("0" + (dateInput.getMonth() + 1)).slice(-2) + "/" + ("0" + dateInput.getDate()).slice(-2) + "/" + dateInput.getFullYear() ;
                return res;
            }

            function check_date(refillOrderDate)
            {
                var datePattern = /^\d{1,2}\/\d{1,2}\/\d{4}$/;
                if (!datePattern.test(refillOrderDate))
                {
                    return false;
                }
                var dateSplit = refillOrderDate.split("/");
                var day = dateSplit[1] ;
                var month =dateSplit[0];
                var year =dateSplit[2];
                if(month>12 || day>31)
                {
                    return false;
                }

                var leap = 0;
                if ((year % 4 == 0) || (year % 100 == 0) || (year % 400 == 0))
                {
                    leap = 1;
                }

                if ((month == 2) && (leap == 1) && (day > 29))
                { return false; }

                if ((month == 2) && (leap != 1) && (day > 28))
                { return false ; }

                if((day > 30) && ((month == "04") || (month == "06") || (month == "09")
                    || (month =="11")))
                { return false; }

                return true;

            }

            function updateDeliveryDate()
            {
                var err=0;
                var orderDate= document.activityForm.orderDate.value;
                if (orderDate.length==0)
                {
                    document.activityForm.orderDate.value='';
                    document.activityForm.startPlaceDate.value='';
                    document.activityForm.endPlaceDate.value='';
                    return true;
                }

                if(orderDate.length==10)
                {
                    if(check_date(orderDate))
                    {
                        document.activityForm.startPlaceDate.value = addDays(orderDate,14);
                        document.activityForm.endPlaceDate.value = addDays(orderDate,28);
                        return true;
                    }
                    else
                    {
                        err=1;
                    }
                }
                else
                {
                    err=1;
                }
                if (err==1)
                {
                    alert("Invalid date format. Date format should be mm/dd/yyyy");
                    document.activityForm.orderDate.value='';
                    document.activityForm.startPlaceDate.value='';
                    document.activityForm.endPlaceDate.value='';
                    document.activityForm.orderDate.focus();
                    return false ;
                }

                return true;
            }
        </script>
    </head>
<body>
    <form name="activityForm" >
        If you order your product On   <input type="text" name="orderDate" onblur="updateDeliveryDate()"/> <font color="red"> [(MM/DD/YYYY) Format]</font>
        <br><br>
        You will get your order between   <input type="text" name="startPlaceDate" readonly/>       and     
             <input type="text" name="endPlaceDate" readonly/>
    </form>

</body>
</html>

SAMPLE OUTPUT

The intention of below prog is to validate the input date using java script.
User has to enter the date in 'MM/DD/YYYY' format in the text box . On loosing the focus from the text field , the input date should be validated

Following Program will validate the user entered data using java script

<%--
    Document   : Hi.html
    Date Validation in Java script
    Author     : murali
--%>

<html>

<script>

function check_date()
{
var check = 0;
var orderDate= document.dateForm.orderDate.value;

if(orderDate.length==0)
{
    //do nothing when nothing entrered
    return true;
}

if(orderDate.length!=10)
{
    //user should enter in mm/dd/yyyy of length 10 , if not
    alert('Invalid Date len'+orderDate.length);
    document.dateForm.orderDate.focus();
    return false;
}

var datePattern = /^\d{1,2}\/\d{1,2}\/\d{4}$/;
if (!datePattern.test(orderDate))
{
    alert('Invalid Date. Plz enter date in mm/dd/yyyy format');
    document.dateForm.orderDate.focus();
    return false;
}

var dateSplit = orderDate.split("/");
var day = dateSplit[1] ;
var month =dateSplit[0];
var year =dateSplit[2];

if(month>12 || day>31)
{
    alert('day / month error');
    return false;
}

var leap = 0;

if ((year % 4 == 0) || (year % 100 == 0) || (year % 400 == 0))
{
leap = 1;
}

if ((month == 02) && (leap == 1) && (day > 29))
{
    check=1;
}

if ((month == 02) && (leap != 1) && (day > 28))
{
    check=1;

}

if((day > 30) && ((month == 04) || (month == 06) || (month == 09) || (month ==11)))
{
    check=1;
}

if(check==1)
   {
    alert('Invalid Date');
    document.dateForm.orderDate.focus();
    return false;
   }

alert('Valid date');
return true;

}
</script>

    <body>
        <form name="dateForm" >
            Enter Date in (MM/DD/YYYY) Format          <input type="text" name="orderDate"   onblur="check_date()"/>
        </form>
    </body>
</html>

SAMPLE OUTPUT

Java World

Wednesday, October 10, 2012

Add days to Input Date

Tuesday, October 9, 2012

Date validation using Java Scripts