Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 12 of 12
  1. #1
    Regular Coder
    Join Date
    Nov 2005
    Posts
    225
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Date format using Javascript select date calendar

    Hello,
    How do I make the Date field to be "05/10/2007"???
    I mean, the zero '0' must be enterred.
    I check on this forum, there is some posts talk about this format "MM/DD/YYYY" but I dont' see any post talks about "05/10/2007".

    is there any JS validation code to do this format?

    thanks.
    Last edited by jennypretty; 05-10-2007 at 06:52 PM.

  • #2
    Regular Coder
    Join Date
    Nov 2005
    Posts
    225
    Thanks
    2
    Thanked 0 Times in 0 Posts
    Is there any other easier way to do this?
    This script needs to place copyright on so I dont' want to use it.

    thanks.

  • #3
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,730
    Thanks
    202
    Thanked 2,507 Times in 2,485 Posts
    It is not very clear what you are trying to do.
    Are you asking for a script to validate a date entered by the user in MM/DD/YYYY format?
    Or are you simply requiring that a leading zero is entered where appropriate?

  • #4
    Regular Coder
    Join Date
    Nov 2005
    Posts
    225
    Thanks
    2
    Thanked 0 Times in 0 Posts
    I want the leading zero is enterred where appropriate.
    MM and DD must have TWO digits (05/10/2007 or 05/02/2007).
    Is this possible?

    Thansk.

  • #5
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,730
    Thanks
    202
    Thanked 2,507 Times in 2,485 Posts
    Something like this:-

    function validate(datefield){
    var x = document.getElementById(datefield);
    var failFlag=0;
    if(!(/^\d{2}\/\d{2}\/\d{4}/.test(x.value))) {
    failFlag=1; // wrong format
    }
    var ss=x.split("/");
    if (ss[1] <1 || ss[0] >31) {failFlag=1} // day
    if (ss[0] <1 || ss[1] >12) {failFlag=1} // month
    if (ss[2] <2000 || ss[2] <2099) {failFlag=1} //max year 2099
    if (failFlag==1) {
    x.value='';
    x.focus();
    alert('Date format must be mm/dd/yyyy e.g. 02/26/2007');
    }
    }

    This still does not check for invalid dates such as 30th February.

  • #6
    Regular Coder
    Join Date
    Nov 2005
    Posts
    225
    Thanks
    2
    Thanked 0 Times in 0 Posts
    Hello,
    I change datefield to my datefieldname and on the form <input> text box I added these:
    onkeyup="validate(this)" onblur="validate(this)"

    When I test the text box by entering the date and move to next field, nothing happens.

    What did I do wrong?

    thanks.

  • #7
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,730
    Thanks
    202
    Thanked 2,507 Times in 2,485 Posts
    Delete onkeyup="validate(this)" The script will only validate the complete datefield.
    Revise the script as follows:-

    <SCRIPT type="Text/JavaScript">
    function validate(which){
    var x = which.value;
    var failFlag=0;
    if(!(/^\d{2}\/\d{2}\/\d{4}/.test(x))) {
    failFlag=1; // wrong format
    }
    var ss=x.split("/");
    if (ss[0] <1 || ss[1] >12) {failFlag=1} // month
    if (ss[1] <1 || ss[0] >31) {failFlag=1} // day
    if (ss[2] <2000 || ss[2] >2099) {failFlag=1} //max year 2099 or whatever
    if (failFlag==1) {
    which.value='';
    which.focus();
    alert('Date format must be mm/dd/yyyy e.g. 02/26/2007');
    }
    else {alert ("Date is OK")} // for test purposes
    }
    </SCRIPT>

    <p><input type = "text" name="datefield" id ="datefield" onblur="validate(this)"></p>
    Last edited by Philip M; 05-11-2007 at 07:21 PM. Reason: Improved version

  • #8
    Regular Coder
    Join Date
    Nov 2005
    Posts
    225
    Thanks
    2
    Thanked 0 Times in 0 Posts
    I removed that link but still doesn't work.
    here is my code:

    <html>
    <head>
    <title></title>
    <script language="javascript">
    <!--
    function validate(Datefield){
    var x = document.getElementById(Datefield);
    var failFlag=0;
    if(!(/^\d{2}\/\d{2}\/\d{4}/.test(x.value))) {
    failFlag=1; // wrong format
    }
    var ss=x.split("/");
    if (ss[1] <1 || ss[0] >31) {failFlag=1} // day
    if (ss[0] <1 || ss[1] >12) {failFlag=1} // month
    if (ss[2] <2000 || ss[2] <2099) {failFlag=1} //max year 2099
    if (failFlag==1) {
    x.value='';
    x.focus();
    alert('Date format must be mm/dd/yyyy e.g. 02/26/2007');
    }
    }

    function count(){
    c=document.getElementById('count');
    if(!this.checked) c.innerHTML=parseInt(c.innerHTML)+1; //if we're unchecking the box increase the value of count by 1
    else if(c.innerHTML>0) c.innerHTML=parseInt(c.innerHTML)-1; //if we're checking the box and count > 0 then decrease count by 1
    else return false; //otherwise if the box is checked and count = 0 then don't let another box get checked
    }

    function clickd(){
    const numboxes = document.skittles.color.length;
    for(j=1;j<=numboxes;j++)
    document.getElementById('q'+j).onclick=count; //create an onclick event for the checkboxes
    }

    function chFrm() {
    var msgbox = "You forgot the following question\n";
    var goon = msgbox

    if (document.frmName.selectname.value==0) {
    msgbox = msgbox + "\n Please select one name";
    }

    // If no errors found, then go ahead to submit the form
    if (msgbox == goon) {
    return true;
    } else {

    alert(msgbox);
    return false;
    }
    }
    // End -->
    </script>
    </head>

    <body>
    <p>Please check off <span id="count">2</span> boxes </p> <!--Added this line to let users know how many to check off-->
    <form name="skittles">
    <input type="checkbox" name="color" onClick="clickd()" id="q1" value="a" />A<BR /> <!--changed id from "q" to "q1"-->
    <input type="checkbox" name="color" onClick="clickd()" id="q2" value="b" />b<BR />
    <input type="checkbox" name="color" onClick="clickd()" id="q3" value="c" />c<BR />
    <input type="checkbox" name="color" onClick="clickd()" id="q4" value="d" />d<BR />
    Enter date:
    <input type="text" size="12" maxlength="30" name="Datefield" onblur="validate(this)" id="Date2" />
    </form>

    </body>
    </html>

  • #9
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,730
    Thanks
    202
    Thanked 2,507 Times in 2,485 Posts
    See edited post (revised script) above. It is working fine for me. I do not see where your date is to be entered.

  • #10
    Regular Coder
    Join Date
    Nov 2005
    Posts
    225
    Thanks
    2
    Thanked 0 Times in 0 Posts
    Woh woh woh, it worked perfectly.
    Big thanks.

  • #11
    New Coder
    Join Date
    Aug 2005
    Posts
    24
    Thanks
    0
    Thanked 0 Times in 0 Posts
    function validDate(){
    var x = document.getElementById('datefield');
    if((/^\d+\/\d+\/\d{4}/.test(x.value))){
    const startYear = 2000;
    const endYear = 2099;

    var ss=x.value.split("/");

    if (ss[2]>=startYear&&ss[2]<=endYear) //year
    if (ss[0]>=1&&ss[0]<=12) // month
    if (ss[1]>=1&&ss[1]<=maxdays(ss[0],ss[2])) // day
    {
    x.value=addZero(ss[0])+'/'+addZero(ss[1])+'/'+ss[2];
    return true;
    }
    alert('Invalid Date');
    return false;
    }

    alert('Date format must be mm/dd/yyyy e.g. 02/26/2007');
    x.value='';
    x.focus();
    }

    function maxdays(month, year){
    //expression?true expression:false expression
    //0 is always false
    if(month==2) return year%4?28:29; //leap year
    return month%2?31:30; //months alternate between 30 and 31 days
    }

    function addZero(val){ return val<10&&val.length>2?'0'+val:val; }
    This does what you want.

  • #12
    New Coder
    Join Date
    Aug 2005
    Posts
    24
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Complete file

    http://dasickis.com/codehelp/jennypretty.html

    This does complete date checks (i.e. checks for leap years & best dates), also it fixes the value if it is not properly formatted.
    Last edited by dasickis; 05-11-2007 at 08:02 PM.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •