Jquery validator add method month year

Hello experts
I need help to create a custom jQuery.validator.addMethod for a date input with only month and year.
Format: mm/yyyy where month from 01 to 12 and year from 1990 to 2015.
Any help?
LVL 2
PanosAsked:
Who is Participating?

[Product update] Infrastructure Analysis Tool is now available with Business Accounts.Learn More

x
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

Jeff DarlingDeveloper AnalystCommented:
I think this is what you are asking for.

http://jsfiddle.net/jeffld/0ow4gsq3/
0
Jeff DarlingDeveloper AnalystCommented:
sample

<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.9/jquery.validate.js"></script>
<style>
.error{
  color: #FF0000;
}

</style>
<script>
$(document).ready(function(){
 $.validator.addMethod("monthYear", function (value, element) {
        return this.optional(element) || /^\d{2}\/\d{4}$/.test(value);
    }, "Please enter MM/YYYY format only.");

    $.validator.addMethod("monthLimit", function (value, element) {
        var myRegexp = /^(\d{2})(.*?)$/;
        var match = myRegexp.exec(value);
        var bValid;
        bValid = false;
        if (match[1] > 0 && match[1] < 13) {
            bValid = true;
        }
        return this.optional(element) || bValid;
    }, "Please enter month between 1 and 12");

    $.validator.addMethod("yearLimit", function (value, element) {
        var myRegexp = /^(.*?)(\d{4})$/;
        var match = myRegexp.exec(value);
        var bValid;
        bValid = false;
        if (match[2] > 1989 && match[2] < 2016) {
            bValid = true;
        }
        return this.optional(element) || bValid;
    }, "Please enter Year between 1990 and 2015 only.");


    $("form").validate({
        rules: {
            monthYear: {
                required: true,
                minlength: 7,
                monthYear: true,
                monthLimit: true,
                yearLimit: true
            }
        },
        submitHandler: function () {
            alert('successful submit');
            return false;
        }
    });
});
</script>
</head>
<body>

<form method="POST">
    <table border=1>
    <tr>
    <td>MM/YYYY</td>
    <td><input type="text" name="monthYear" value="" /></td>
    <td><div class="error" id="error"></div></td>
    </tr>
    </table>
    <input type="submit">
</form>

</body>
</html>

Open in new window

0
PanosAuthor Commented:
Hi Jeff Darling
Thank you for your post.
Take a look at my remake using your sample code.
Why it is not working right?
$.validator.addMethod("monthYear", function (value, element) {return this.optional(element) || /^\d{2}\/\d{4}$/.test(value);});
$.validator.addMethod("monthLimit", function (value, element) {
        var myRegexp = /^(\d{2})(.*?)$/;
        var match = myRegexp.exec(value);
        var bValid;
        bValid = false;
        if (match[1] > 0 && match[1] < 13) {
            bValid = true;
        }
        bValid;
    });
$.validator.addMethod("yearLimit", function (value, element) {
        var myRegexp = /^(.*?)(\d{4})$/;
        var match = myRegexp.exec(value);
        var bValid;
        bValid = false;
        if (match[2] > 1989 && match[2] < 2015) {
            bValid = true;
        }
        bValid;
    });
	$("#myform").validate({
		
		rules: {
			  monthYear: {required: true,minlength: 7,monthYear: true,monthLimit:true,yearLimit:true}
		},
        messages: {
			monthYear:{required:'required',minlength:"Min. length: 7",monthYear:'Please enter MM/YYYY format only.',monthLimit:'Please enter month between 1 and 12',yearLimit:'Please enter Year between 1990 and 2015 only.'}
		}
	}
	);

Open in new window

0
Big Business Goals? Which KPIs Will Help You

The most successful MSPs rely on metrics – known as key performance indicators (KPIs) – for making informed decisions that help their businesses thrive, rather than just survive. This eBook provides an overview of the most important KPIs used by top MSPs.

PanosAuthor Commented:
I did copy paste your code and it is working perfect. If you can please post the way using the messages attribute too.
0
Jeff DarlingDeveloper AnalystCommented:
The return statements on the functions are required.

See line 23 and 33

<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.9/jquery.validate.js"></script>
<style>
.error{
  color: #FF0000;
}

</style>
<script>
$(document).ready(function(){
$.validator.addMethod("monthYear", function (value, element) {return this.optional(element) || /^\d{2}\/\d{4}$/.test(value);});
$.validator.addMethod("monthLimit", function (value, element) {
        var myRegexp = /^(\d{2})(.*?)$/;
        var match = myRegexp.exec(value);
        var bValid;
        bValid = false;
        if (match[1] > 0 && match[1] < 13) {
            bValid = true;
        }
        return bValid;
    });
$.validator.addMethod("yearLimit", function (value, element) {
        var myRegexp = /^(.*)(\d{4})$/;
        var match = myRegexp.exec(value);
        var bValid;
        bValid = false;
        if (match[2] > 1989 && match[2] < 2016) {
            bValid = true;
        }
        return bValid;
    });
	$("form").validate({

		rules: {
			  monthYear: {required: true,minlength: 7,monthYear: true,monthLimit:true,yearLimit:true}
		},
        messages: {
			monthYear:{required:'required',minlength:"Min. length: 7",monthYear:'Please enter MM/YYYY format only.',monthLimit:'Please enter month between 1 and 12',yearLimit:'Please enter Year between 1990 and 2015 only.'}
		}
	}
	);
});
</script>
</head>
<body>

<form method="POST">
    <table>
    <tr>
    <td>MM/YYYY</td>
    <td><input type="text" name="monthYear" value="" /></td>
    <td><div class="error" id="error"></div></td>
    </tr>
    </table>
    <input type="submit">
</form>

</body>
</html>

Open in new window

0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
PanosAuthor Commented:
Thank you very much.
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
jQuery

From novice to tech pro — start learning today.