?
Solved

Using jquery validation, how do I validate a Date of Birth with 3 different select boxes?

Posted on 2010-11-10
5
Medium Priority
?
737 Views
Last Modified: 2012-05-10
I have a signup form that I am validating using jquery, and I am trying to validate a Date of Birth that is spread across 3 different select boxes.

You can see this form at
http://www.rewardsring.com/sandbox/signup2V.html

My current approach is to create a hidden field next to the three select boxes and validate that instead (with the associated code necessary to build the value of that field).
I then wrote my own validation method (properDate) to make sure that dates like September 31st aren't permitted.
I also want the three select boxes to appear red if there is a problem with the date.

Unforunately, it doesn't seem to work at all, and I have no idea how to fix it, so any help is appreciated. (For example, Feb-31-1984 seems to be a valid date!?!?!)
0
Comment
Question by:sjamal_hsj
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 3
  • 2
5 Comments
 
LVL 7

Accepted Solution

by:
dxdinh earned 1500 total points
ID: 34106752
1.  you can add the check valid date function and test against
   

    var dob1 =   $("#user_dob").val();
  if (!checkDate(dob1)) {
        // focus if validation fails
       alert ('Please correct dob');
    }


2.  or you can pre populate based on user selection cascading
   Feb then populate 28 day
   if select leap year then populate 29 days....  of course you have to change a lot in your logic.



<!--
     Example File From "JavaScript and DHTML Cookbook"
     Published by O'Reilly & Associates
     Copyright 2003 Danny Goodman
-->

function checkDate(fld) {
    var mo, day, yr;
    var entry = fld.value;
    var re = /\b\d{1,2}[\/-]\d{1,2}[\/-]\d{4}\b/;
    if (re.test(entry)) {
        var delimChar = (entry.indexOf("/") != -1) ? "/" : "-";
        var delim1 = entry.indexOf(delimChar);
        var delim2 = entry.lastIndexOf(delimChar);
        mo = parseInt(entry.substring(0, delim1), 10);
        day = parseInt(entry.substring(delim1+1, delim2), 10);
        yr = parseInt(entry.substring(delim2+1), 10);
        var testDate = new Date(yr, mo-1, day);
        alert(testDate)
        if (testDate.getDate() == day) {
            if (testDate.getMonth() + 1 == mo) {
                if (testDate.getFullYear() == yr) {
                    return true;
                } else {
                    alert("There is a problem with the year entry.");
                }
            } else {
                alert("There is a problem with the month entry.");
            }
        } else {
            alert("There is a problem with the date entry.");
        }
    } else {
        alert("Incorrect date format. Enter as mm/dd/yyyy.");
    }
    return false;
}
0
 

Author Comment

by:sjamal_hsj
ID: 34106782
In regards to the first solution, that doesn't really use jquery. Technically, using javascript, I know how to test for a valid date, but I wanted to do it using the jquery validation plugin.

For the second solution, it would work, but it does require a large amount of extra code. Also, it wouldn't solve my problem of validating 3 select boxes as a group using jquery.

Thanks for the input though
0
 
LVL 7

Expert Comment

by:dxdinh
ID: 34107268
I guess the question s/b how to extend jQuery validation plugin to date selection drop down list box.
0
 

Author Comment

by:sjamal_hsj
ID: 34107751
To be honest, I'm not sure if it needs to be extended. I'm new to jquery, and I was wondering if it was possible, using the jquery validation plugin, to validate a date that uses 3 select boxes.

If not, then I suppose I can change it to an input box.
0
 

Author Closing Comment

by:sjamal_hsj
ID: 36185160
my question was perhaps more vague than it needed to be
0

Featured Post

Get 15 Days FREE Full-Featured Trial

Benefit from a mission critical IT monitoring with Monitis Premium or get it FREE for your entry level monitoring needs.
-Over 200,000 users
-More than 300,000 websites monitored
-Used in 197 countries
-Recommended by 98% of users

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Introduction Knockoutjs (Knockout) is a JavaScript framework (Model View ViewModel or MVVM framework).   The main ideology behind Knockout is to control from JavaScript how a page looks whilst creating an engaging user experience in the least …
This article discusses how to implement server side field validation and display customized error messages to the client.
Viewers will learn about basic arrays, how to declare them, and how to use them. Introduction and definition: Declare an array and cover the syntax of declaring them: Initialize every index in the created array: Example/Features of a basic arr…
The viewer will receive an overview of the basics of CSS showing inline styles. In the head tags set up your style tags: (CODE) Reference the nav tag and set your properties.: (CODE) Set the reference for the UL element and styles for it to ensu…
Suggested Courses

777 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question