验证日期字段

Question

I have a date field on a form. The date in the date field has to be after today's date and not in the past. It also has to be within 30 days from today's date. So if today is 15/01/2013, then the form can only accept any date within 30 days after the 15/02/2013, so the 14/04/2007 plus 30 days!

Can any please help with the correct Javascript code? I'm an amature and don't have a clue on how to achieve this.

Answer 1

I guess you need something like this: http://jsfiddle.net/hqNxW/1/

And the code...

JavaScript

var output = document.getElementById('messageOutput');
document.getElementById('validate').onclick = function () {
    var value = document.getElementById('date').value;
    if (!validateDate(value)) {
        notify('Invalid date format');
    } else {
        if (!validateDateRange(value)) {
            notify('The date should be after today but not more than 29 days!');
        } else {
            notify('Valid date');
        }
    }
}

function notify(msg) {
    output.innerHTML = msg;
}

function validateDate(date) {
    return (/^\d{2}-\d{2}-\d{4}$/).test(date);
}

function validateDateRange(inputDate) {
    var now = new Date(),
        after30Days = new Date().setDate(now.getDate() + 30)
        date = new Date(inputDate);
    return date > now && date < after30Days;
}

HTML

<input type="text" id="date" /> <button id="validate">Validate</button>
<div id="messageOutput">Enter a date in the following format: mm-dd-yyyy</div>

Answer 2

Your validation function should be somthing like that:

function validateDateField()
{
  var result=true;        // optimistic....

  var now=new Date();
  var thisMonth=now.getMonth();
  var maxDate=new Date();
  maxDate.setMonth(thisMonth+1);

  //---------getting the user input:
  var dateStr=document.getElementById('dateField').value;

  //change "dd/mm/yyyy" format to "yyyy/mm/dd" format:
  dateStr = dateStr.replace(" ","");
  dateStr = dateStr.substr(6,4)+"/"+dateStr.substr(3,2)+"/"+dateStr.substr(0,2);

  //---------validation part:
   document.getElementById('feadBackLable').innerHTML="";
  try
  {
    var userDate=new Date(Date.parse(dateStr));
    if(userDate < now || userDate > maxDate)  
     {
           result=false;
           document.getElementById('feedBackLable').innerHTML="your date should be one of the next 30 days";
     }
  }
  catch(err)
  {
     result=false;
     document.getElementById('feadBackLable').innerHTML="please enter a valid date: dd/mm/yyyy";
  }
  //---------------------------
  return result;

} // function