JavaScript - Validation
Hello to everyone
i need to validate a form Based on radio buttons and text box my code so far Code: <html> <head> <title>My Page</title> <script type="text/javascript"> function validate(thisform) { document.getElementByName("bank");//text box // validate myradiobuttons radio = -1; for (i=thisform.day.length-1; i > -1; i--) { if (thisform.day[i].checked) { radio = i; i = -1; } } if (radio == -1) { alert("You must select all values for the clock !"); return false; } else { return true; } } //bank code validation if (document.getElementByName("bank").value.length>=6) { return true; } else { alert("you must input maximum 6 digit (123456) !"); return false; } } </script> </head> <body> <form action="form-output.php" method="post" id="form"> <input type="radio" name="day" value="f" onclick="dayofweek(this)" /> Sunday (default) <input type="radio" name="day" value="s" onclick="dayofweek(this)" /> Sun </p> <input type="radio" name="month" value="a" onclick="dateformat(this)" /> 28th March 2010 (default) <input type="radio" name="month" value="b" onclick="dateformat(this)" /> 28 March 2010 <input type="radio" name="month" value="c" onclick="dateformat(this)" /> 28th Mar 2010 <input type="radio" name="month" value="d" onclick="dateformat(this)" /> 28 Mar 2010 <input type="radio" name="month" value="e" onclick="dateformat(this)" /> 28/03/2010 <input type="radio" name="month" value="f" onclick="dateformat(this)" /> 28th March 10 <input type="radio" name="month" value="g" onclick="dateformat(this)" /> 28 March 10 <input type="radio" name="month" value="h" onclick="dateformat(this)" /> 28th Mar 10 <br/> <input type="radio" name="month" value="i" onclick="dateformat(this)" /> 28 Mar 10 <input type="radio" name="month" value="j" onclick="dateformat(this)" /> 28/03/10 <input type="radio" name="month" value="k" onclick="dateformat(this)" /> 28th March <input type="radio" name="month" value="l" onclick="dateformat(this)" /> 28 March <input type="radio" name="month" value="m" onclick="dateformat(this)" /> 28th Mar <input type="radio" name="month" value="o" onclick="dateformat(this)" /> 28 Mar <input type="radio" name="month" value="p" onclick="dateformat(this)" /> 28/03 </p> <input type="radio" name="time" value="a" onclick="timeformat(this)" /> 5:28:12 am (Default) <input type="radio" name="time" value="b" onclick="timeformat(this)" /> 5:28 am <input type="radio" name="time" value="c" onclick="timeformat(this)" /> 5:28:12 <input type="radio" name="time" value="d" onclick="timeformat(this)" /> 5:28 <input type="radio" name="time" value="e" onclick="timeformat(this)" /> 17:28:12 <input type="radio" name="time" value="f" onclick="timeformat(this)" /> 17:28 </p> Input a short Bank Code <input type="text" name="bank" size="10" onblur="JavaScript:alert('You must insert a Bank Code')" /></br> <input type="submit" name="submit" onclick="validate(form);return false;" value="Submit" /> <input type="reset" name="reset" value="reset" /> </form> </body> </html> i need on submit to validate if user select values from 3 radio groups and insert the proper data to text box. if not i want to return the proper alerts in text box also i want when lose focus to validate so i put this Code: onblur="JavaScript:alert('You must insert a Bank Code')" it's ok? Thanks in Advance Similar TutorialsHey all. I have a simple validation I need to do. I need to just make sure that a Checkbox is checked, and that a Text field has content. Sounds simple but I cannot find any thing that has a check and a text field. Here what I have. Can I modify this script to do this? A Checkbox MUST be checked and Text field MUST be filled out. This currently does the text field fine, but no Checkbox obviously. How can I add a checkbox validation to this? Thats it. Any help is appreciated. Code: <script type="text/javascript"> var textFields = ["digsig"]; function validateForm( ) { var oops = ""; // must initialize this! var form = document.sig; for ( var t = 0; t < textFields.length; ++t ) { var field = form[textFields[t]]; var value = field.value.replace(/^\s+/,"").replace(/\s+$/,""); // trim the input if ( value.length < 1 ) { oops += "You MUST enter your Digital Signature"; } } if ( oops != "" ) { alert("ERROR:" + oops); return false; } } } </script> Hello all, new here Seems like a very nice place to be apart of. I have my website www.gebcn.com. If you view source you will see all that I have done, but more importantly my problem. I have the JS code at the top there and I am unable to W3C validate my HTML because of the JS. I am using XHTML strict and would like to stay using it. The JS I have at the top is my form validation code. I am able to do any validating that I need with this "snippet" of code, I have shrank it from my library version just to use for this newsletter. Until now W3C validating was not important now for some reason it is and I am faced with this problem. I am not a Javascript guy more of a HTML/CSS guy and I can manipulate JS to suit my needs. <problem> I have tried to make this "snippet" of JS code an external file but receive multiple errors with the JS calling for the FORM NAME as it is not on the same page. The form NAME=NEWSLETTER is another problem, as W3C says I am unable to use attribute "NAME" in this location. <problem> I would like to keep the JS close to how it is now as I have a library to use this JS over and over again. Any pointers in the right direction or solutions to my problem would be greatly appreciated. Thanks! Hopefully it is not to hard huh If there is anything anyone needs, the code pasted here, or anything else please let me know. Thanks again! Hi, got my form here Code: <form method="POST" onsubmit="return validateFormOnSubmit1(this)" action="sendEmail.php"> <p class="demo2">Receivers E-mail<a class="textFields"> <input type="text" name="receiver" size="30" maxlength="35" /></a></p> <p class="demo2">Senders E-mail<a class="textFields2"> <input type="text" name="sender" size="30" maxlength="35" /></a></p> <p class="btn" > <input name="Submit" type="submit" value="Send"/></p> </form> And that should call up this Code: function validateFormOnSubmit1(theForm) { var reason = ""; reason += validateEmail1(theForm.receiver); reason += validateEmail1(theForm.sender); if (reason != "") { alert("Some fields need correction:\n" + reason); return false; } return true; } function trim(s) { return s.replace(/^\s+|\s+$/, ''); } function validateEmail1(fld) { var error=""; var tfld = trim(fld.value); // value of field with whitespace trimmed off var emailFilter = /^[^@]+@[^@.]+\.[^@]*\w\w$/ ; var illegalChars= /[\(\)\<\>\,\;\:\\\"\[\]]/ ; if (fld.value == "") { fld.style.background = 'Yellow'; error = "You didn't enter an email address.\n"; } else if (!emailFilter.test(tfld)) { //test email for illegal characters fld.style.background = 'Yellow'; error = "Please enter a valid email address.\n"; } else if (fld.value.match(illegalChars)) { fld.style.background = 'Yellow'; error = "The email address contains illegal characters.\n"; } else if (fld.value.length == 0) { fld.style.background = 'Yellow'; error = "The required field has not been filled in.\n" } else { fld.style.background = 'White'; } return error; } For some reason though the validation is not working. Is there anything obvious I am doing wrong? cheers Hello, I dont know if I am going about this the right way, but.. I am trying to validate an email address. If the email is a valid looking email address, it will render the submit button disabled to prevent dupe's while the rest of the script processes. The email validation portion works, but, the part where it renders the form submit button disabled does not: <script type="text/javascript"> function validate_email(field,alerttxt) { with (field) { apos=value.indexOf("@"); dotpos=value.lastIndexOf("."); if (apos<1||dotpos-apos<2) {alert(alerttxt);return false;} else {return true; submit.disabled = true;} } } function validate_form(thisform) { with (thisform) { if (validate_email(email,"Please enter a valid email address.")==false) {email.focus();return false;} } } </script> Any guidance or help would be apreciated. I keep getting validation errors for using && as and. I've read to put "&" in place of it, but whenever I do this, the code stops working. I've tried seperate parenths, and still confused. anyone help to make this work and validate at the same time? if (first=="" && last=="") first = last = "Unknown"; if (first == '') document.writeln(last); else if (last == '') document.writeln(first); else document.writeln (last + ", " + first); Hey. Could someone point me in the direction of why this is not working, it worked in my last program, but not since I have changed things. I have a standard html form Code: <form method="POST" onsubmit="return validate_form(this)" action="anniversaryPreview.php"> <p class="demo5">Senders Name<a class="textFields2"> <input type="text" name="sender" value="e.g. Love from Nick" size="30" maxlength="35" /></a></p> <p class="btn2" > <input type="submit" value="Preview"></p> </form> And this should call up return validate_form(this) before bringing up the php page. Now the validator is just Code: function validate_required(field, alerttxt) { if (field.value == null || field.value == "") { alert(alerttxt); return false; } else { return true; } } function validate_form(thisform) { if (validate_required(thisform.name,"Please specify the receivers name.")==false) { thisform.name.focus(); return false; } if (validate_required(thisform.sender,"Please specify the sender's name.")==false) { thisform.sender.focus(); return false; } } (This is not in the html file, but its own seperate file) I cant see if I have made any mistakes with the variables names or something, or what I am doing wrong. Dont get any errors, just nothing happens if I leave my forms fields blank. Anyone have an idea of whats going on here? cheers In my project i have a from which have several fields. The form is <form name="reg" action="payment.jsp" method="post"> ----------- <tr> <td>First name:</td> <td><input type="text" name="firstname"/></td></tr> -------------------------- <input type="submit" value="Next" onclick="fun()" /> ------------ </form> Then to validate the fields i have used JavaScript.They are validating rightly using a alert box. But when i am pressing ok of the alert box the control is passing to the page i have written in action of the form.I want when i will press ok it should come back to the same page.Only if all fields are then it should go to the page refereed in action. Can anyone help me? The JavaScript code is <script type="text/javascript"> function fun() { var x=document.forms["reg"]["firstname"].value; if (x==null || x=="") { alert("First name must be filled out"); } Hi All, I have a java script invoked within an ANT template. This java script as of now converts a text file to xml file. Now, how would I do the schema validation of that XML file against an XSD in the javascript? Saw many examples online but they were using MSXML or java classes Would be glad to have any sort of suggestions.. Thanks Code: <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=windows-1252"> <title>New Page 2</title> </head> <script type="text/javascript"> var strWord = document.myForm.txtWord.value; function validateWord() { while(strWord == document.formname.myForm.value.length > 8 && var ichars = "PJ" ); { alert ("OK."); } } </SCRIPT> <form name="myForm" action="" method="" onsubmit="return false"> <p> <input name="txtWord" size="25" value="Enter Word Here"> </p> <p> <input type="button" value="Validate The Word" name="cmdValidateWord" onclick ="validateWord()"> </p> </html> Hi, I'm having trouble getting this code to work. It needs to check if the user has entered the correct characters into a field. A valid word should have a P at the start, and contain a J somewhere in it. If the word is valid, a box pops up saying "OK" once the user has clicked the ValidateWord button. It also needs to keep this kind of structure (ie. a while construct & validated through pressing a button). This is purely for personal education about performance of "while" constructs for field validation. Any help is hugely appreciated. My code is not validating the textboxes..if someone could help me figure this out. Thank you <script type="text/javascript"> function validate() { with (document.form1) { var reg = /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/; var alertMessage = "The following fields\nare REQUIRED:\n\n"; if (realname.value == "") { alertMessage += "Name\n" } if(reg.test(email.value) == "") { alertMessage += "Email\n" } if (phone.value == "") { alertMessage += "Phone\n" } if (security_code.value == "") { alertMessage += "Security Code\n" } if (alertMessage != "The following fields\nare REQUIRED:\n\n") { alert(alertMessage); return (false);} return (true) } } </script> <form action="formmail.php" method="post" enctype="multipart/form-data" name="form1" id="form1" onsubmit="return validate()" > Reply With Quote 01-31-2015, 09:12 AM #2 Philip M View Profile View Forum Posts Supreme Master coder! Join Date Jun 2002 Location London, England Posts 18,371 Thanks 204 Thanked 2,573 Times in 2,551 Posts Have you tried using your error console (F12 key)? if(reg.test(email.value) == "") { should be if(!reg.test(email.value) { as test returns true or false. But form validation of the pattern if (document.formname.formfield.value == "") - that is blank or empty- is barely worthy of the name, and virtually useless, as even a single space, an X or a ? will return false, that is pass the validation. A proper name may only contain letters, hyphen, space and apostrophe. Numeric values, such as zip codes, phone numbers and dates, should be validated as such. Ditto email addresses (as you have done). This topic has been covered many times before in this forum. The use of with is strongly deprecated and is forbidden in strict mode, and alerts are long obsolete as a way of displaying a message to your users. And so is assigning a name to a form - it is allowed only for the sake of backwards compatibility. In short - you should rewrite your code to modern standards. Hi i got a script that validates the fields username and password, can anybody check if this code for checking the username and password for illegal characters is ok or if i need to change it. thanks kimbo Code: addLoadEvent (function() { document.entryform.onsubmit = validateEntry; }); function validateEntry() { var errorMsg = ""; if (document.getElementById("username").value <= "") { errorMsg += "Please enter your username.\n"; } if (document.getElementById("password").value == "") { errorMsg += "Please enter your email password\n"; } else { if (!document.getElementById("username").value.match(/^[\w-]+(\.[\w-]+)*@([\w-]+\.)+[a-zA-Z]{2,7}$/)) { errorMsg += "invalid characters.\n"; } if (!document.getElementById("password").value.match(/^[\w-]+(\.[\w-]+)*@([\w-]+\.)+[a-zA-Z]{2,7}$/)) { errorMsg += "invalid characters.\n"; } } if (errorMsg == "") { return true; } else { alert(errorMsg); return false; } } function addLoadEvent(func) { var oldonload = window.onload; if (typeof window.onload != 'function') { window.onload = func; } else { window.onload = function() { if (oldonload) { oldonload(); } func(); } } } Hello friend, I need a JS validation code for validating numbers such that,Empty space and characters(including + and -) shouldn't be allowed,there should be only one decimal point,spaces and characters between numbers also shouldn't be permitted. I'd like to add validation for 5 digits (numbers only) to this code: if($("#newvalue1").val() == "" && operator == "Equals" || $("#newvalue2").val() == "" && operator == "Range" ){ good = false; alert("5 digits please."); I have tried the code below, but it's not working. Could anyone help, please? Thanks! if($("#newvalue1").val() == "" && operator == "Equals" || $("#newvalue2").val() == "" && operator == "Range" || $("#newvalue2").val() !/^\d{5} && operator == "Range" ){ good = false; alert("5 digits please."); Hello, I'm still learning javascript and have recently started to try to gain a better grasp on it. I'm trying to validate a form to ensure all fields are marked. Everything works except it's not validating the Education Level and Gender. I've looked at other forms in an attempt to correct this, but the changes I've made haven't worked. Any ideas? If you'd rather me upload it to a website, let me know. Thanks Code: function checkTextBox() { if (document.forms[0].name.value == "") { window.alert("You must enter your name."); document.forms[0].name.focus(); return false; } else return true; } function checkRadio() { var genderSelected = false; for (var i = 0; i < 2; ++i) { if (document.forms[0].Gender[i].checked == true) { genderSelected = true; break; } } if (genderSelected != true) { window.alert("You must select your gender."); return false; }else return true; } function checkCheck() { var referralSelected = false; for (var i = 0; i < 3; i++) { if (document.forms[0].referral[i].checked == true) { referralSelected = true; break; } } if (referralSelected == false) { window.alert("You must select how you were referred"); } return referralSelected; } function validateForm() { if (checkTextBox() && checkRadio() && checkCheck()) return true; else return false; } function confirmReset() { var resetForm = window.confirm("Are you sure you want to reset the form?"); if (resetForm == true) return true; return false; } </script> </head> <body> <h2><b>Form Validation Example</b></h2> <form action="EasyFormProcessor.html" method="get" enctype="application/x-www-form-urlencoded"; onsubmit = "return validateForm();" onreset="return confirmReset();"> <p><b>Enter your name: </b> <input type="text" name="name" size="50" /></p> <p><strong>Gender:</strong>: <input type="radio" name="gender" onclick="" value="Male" /> Male <input type="radio" name="gender" onclick="" value="Female" />Female</p> <p> <b>Education Level:</b> <input type="checkbox" name="Education" value="Drop Out" />High School Drop Out <input type="checkbox" name="Education" value="High School Diploma or GED" />High School Diploma/GED <input type="checkbox" name="Education" value="College" />College</p> <p> <b>How did you hear about us? <select name="Referral"> <option value="TV Ads">TV Ads</option> <option value="Newspaper Ad">Newspaper Ad</option> <option value="Search Engine">Search Engine</option> <option value="Friend">Friend</option> <option value="other">Other</option> </select> </b> <p> <input type="submit" value="Submit" /><b> </b><input type="reset" /><b><p> Hi , I need to do javascript money validation for a field. the condtions are 1) depending on the Locale (not sure if this can be done in JS like US,Germany..) 2) verify if it has $,pound symbol, yen symbol.. 3) group the digits either like 00,00,000 or 000,000,000 4) accept 2 digits decimal 000,000.00 cud some one help me with the code please? thanks Hello there. I am trying to validate data for text boxes, radios and check-boxes which are stored in an object. Can anyone suggest how I might go about doing so? Maybe there is a website to learn from? I've had a good look around myself but haven't come across what I'm looking for unfortunately. Thank-you. Hi. I am trying to do some sim[ple form validation using javascript. I have a simple html file Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Send Card</title> <script language="JavaScript" src="gen_validatorv31.js" type="text/javascript"></script> </head> <body> <form action="getName.php" onsubmit="return validate_form(this);"> Receiver (To): <input type="text" name="name"><br> Sender (From): <input type="text" name="sender"><br> Email: <input type="text" name="email"><br> <input type="submit" value="Submit"> </form> </body> </html> Which calls up my javascript and php file (The php file should only be used when the javascript has found no errors). Now I have a js file which does some validation Code: <script type="text/javascript"> function validate_required(field,alerttxt) { with (field) { if (value==null||value=="") { alert(alerttxt); return false; } else { return true; } } } function validate_email(field,alerttxt) { with (field) { apos=value.indexOf("@") dotpos=value.lastIndexOf(".") if (apos<1||dotpos-apos<2) { alert(alerttxt); return false; } else { return true; } } } function validate_form(thisform) { with (thisform) { if (validate_required(name,"Please specify your name!")==false) { name.focus(); return false; } if (validate_required(sender,"Please specify the receivers name!")==false) { sender.focus(); return false; } if (validate_required(email,"Email must be filled out!")==false) { email.focus(); return false; } if (validate_email(email,"Not a valid e-mail address!")==false) { email.focus(); return false; } } } </script> When I run it on my server, I get the form and enter nothing into it, I just click submit. However, it goes straight to the php file and brings up my flash movie, which it shouldnt do. When nothing is entered, the js file should return the error. I thought I had everything set up correctly, but obviously not. Can someone see where I am going wrong? cheers Hey friends, I am working on making a simple form validation that will also validate that the email entered is in proper form. This is my HTML code: Code: <form method="post" form action="sendmail.asp"> <p><label for="emailAddr">Email Address: <input id="emailAddr" type="text" size="30" class="reqd email" /> </label></p> <p><label for="color">Colors: <select id="color" class="reqd"> <option value="">Choose a player</option> <option value="rodgers">Aaron Rodgers</option> <option value="woodson">Charles Woodson</option> <option value="driver">Donald Driver</option> <option value="hawk">A.J. Hawk</option> <option value="bigby">Atari Bigby</option> <option value="barnett">Nick Barnett</option> </select> </label></p> <p>Options: <label for="home"><input type="checkbox" id="home" value="Yes" /> Home Jersey </label> <label for="away"><input type="checkbox" id="away" value="Yes" /> Away Jersey</label></p> <p> <label for="jerseySet">Size: <input type="radio" id="large" name="jerseySet" value="sizeLarge" class="radio" /> Large <input type="radio" id="xlarge" name="jerseySet" value="sizeXlarge" class="radio" /> X-Large </label></p> <p> <label for="zip">Enter your Zip code:<br /> Zip: <input id="zip" type="text" size="5" maxlength="5" class="isZip dealerList" /> <select id="dealerList" size="4" class="zip"> <option value="Kenosha--Wisconsin">Kenosha--Wisconsin</option> <option value="Racine--Wisconsin">Racine--Wisconsin</option> <option value="Milwaukee--Wisconsin">Milwaukee--Wisconsin</option> <option value="Waukesha--Wisconsin">Waukesha--Wisconsin</option> <option value="Waterford--Wisconsin">Waterford--Wisconsin</option> </select> </label></p> <p><input type="submit" value="Submit" /> <input type="reset" /></p> </form> This is my JavaScript: Code: window.onload = initForms; function initForms() { for (var i=0; i< document.forms.length; i++) { document.forms[i].onsubmit = function() {return validForm();} } document.getElementById("home").onclick = jerseySet; } function validForm() { var allGood = true; var allTags = document.getElementsByTagName("*"); for (var i=0; i<allTags.length; i++) { if (!validTag(allTags[i])) { allGood = false; } } return allGood; function validTag(thisTag) { var outClass = ""; var allClasses = thisTag.className.split(" "); for (var j=0; j<allClasses.length; j++) { outClass += validBasedOnClass(allClasses[j]) + " "; } thisTag.className = outClass; if (outClass.indexOf("invalid") > -1) { invalidLabel(thisTag.parentNode); thisTag.focus(); if (thisTag.nodeName == "INPUT") { thisTag.select(); } return false; } return true; function validBasedOnClass(thisClass) { var classBack = ""; switch(thisClass) { case "": case "invalid": break; case "reqd": if (allGood && thisTag.value == "") { classBack = "invalid "; } classBack += thisClass; break; case "radio": if (allGood && !radioPicked(thisTag.name)) { classBack = "invalid "; } classBack += thisClass; break; case "isNum": if (allGood && !isNum(thisTag.value)) { classBack = "invalid "; } classBack += thisClass; break; case "isZip": if (allGood && !isZip(thisTag.value)) { classBack = "invalid "; } classBack += thisClass; break; case "email": if (allGood && !validEmail(thisTag.value)) { classBack = "invalid "; } classBack += thisClass; break; default: if (allGood && !crossCheck(thisTag,thisClass)) { classBack = "invalid "; } classBack += thisClass; } return classBack; } function crossCheck(inTag,otherFieldID) { if (!document.getElementById(otherFieldID)) { return false; } return (inTag.value != "" || document.getElementById(otherFieldID).value != ""); } function radioPicked(radioName) { var radioSet = ""; for (var k=0; k<document.forms.length; k++) { if (!radioSet) { radioSet = document.forms[k][radioName]; } } if (!radioSet) { return false; } for (k=0; k<radioSet.length; k++) { if (radioSet[k].checked) { return true; } } return false; } function isNum(passedVal) { if (passedVal == "") { return false; } for (var k=0; k<passedVal.length; k++) { if (passedVal.charAt(k) < "0") { return false; } if (passedVal.charAt(k) > "9") { return false; } } return true; } function isZip(inZip) { if (inZip == "") { return true; } return (isNum(inZip)); } function validEmail(email) { var invalidChars = " /:,;"; if (email == "") { return false; } for (var k=0; k<invalidChars.length; k++) { var badChar = invalidChars.charAt(k); if (email.indexOf(badChar) > -1) { return false; } } var atPos = email.indexOf("@",1); if (atPos == -1) { return false; } if (email.indexOf("@",atPos+1) != -1) { return false; } var periodPos = email.indexOf(".",atPos); if (periodPos == -1) { return false; } if (periodPos+3 > email.length) { return false; } return true; } function invalidLabel(parentTag) { if (parentTag.nodeName == "LABEL") { parentTag.className += " invalid"; } } } } function jerseySet() { if (this.checked) { document.getElementById("sizeLarge").checked = true; } } It will not submit and process. What am I doing wrong? Thanks so much in advance. Hello I have some JS email validation which does not appear to be working. I originally had a form and decided to add validation to it, so I am adding JS to that original file. My original form used this: Code: <form action="form_script.asp" method="POST" enctype="multipart/form-data" onSubmit="return onSubmitForm();"> and the validation script uses this: Code: <form name="theform" method="post" action="#" onSubmit="return check(this);"> I am trying to get them both to work. How would I do that, please? The test site is he http://proofreading4students.com/contact_test.asp Thanks for any help. Steve hi there all, i am working on an application built using JSP, and many screens in the application have date fields that use a calendar.js file to show and pick the date. the requirement is to set a validation where the user cannot enter a date bigger than the current date, fair enough, but my problem is that i am a newb and this whole application is built by ppl that don't work for my company no more so im stuck with it, below is the calendar.js file maybe u guys could help me on where should i put the validation. thanks in advance Code: var weekend = [4,5]; var weekendColor = "#EAF4D6"; var fontface = "Verdana"; var fontsize = 1; var TYPE = 1; // 1 for arabic and 2 for hirji var gNow = new Date(); var ggWinCal; isNav = (navigator.appName.indexOf("Netscape") != -1) ? true : false; isIE = (navigator.appName.indexOf("Microsoft") != -1) ? true : false; Calendar.Months = ["�����", "������", "����", "�����", "����", "�����", "�����", "�����", "������", "�������", "�����", "������"]; // Non-Leap year Month days.. Calendar.DOMonth = [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31]; // Leap year Month days.. Calendar.lDOMonth = [31, 29, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31]; function Calendar(p_item, p_WinCal, p_month, p_year, p_format) { if ((p_month == null) && (p_year == null)) return; if (p_WinCal == null) this.gWinCal = ggWinCal; else this.gWinCal = p_WinCal; if (p_month == null) { this.gMonthName = null; this.gMonth = null; this.gYearly = true; } else { this.gMonthName = Calendar.get_month(p_month); this.gMonth = new Number(p_month); this.gYearly = false; } this.gYear = p_year; this.gFormat = p_format; this.gBGColor = "white"; this.gFGColor = "black"; this.gTextColor = "black"; this.gHeaderColor = "black"; this.gReturnItem = p_item; } Calendar.get_month = Calendar_get_month; Calendar.get_daysofmonth = Calendar_get_daysofmonth; Calendar.calc_month_year = Calendar_calc_month_year; Calendar.print = Calendar_print; function Calendar_get_month(monthNo) { return Calendar.Months[monthNo]; } function Calendar_get_daysofmonth(monthNo, p_year) { /* Check for leap year .. 1.Years evenly divisible by four are normally leap years, except for... 2.Years also evenly divisible by 100 are not leap years, except for... 3.Years also evenly divisible by 400 are leap years. */ if ((p_year % 4) == 0) { if ((p_year % 100) == 0 && (p_year % 400) != 0) return Calendar.DOMonth[monthNo]; return Calendar.lDOMonth[monthNo]; } else return Calendar.DOMonth[monthNo]; } function Calendar_calc_month_year(p_Month, p_Year, incr) { /* Will return an 1-D array with 1st element being the calculated month and second being the calculated year after applying the month increment/decrement as specified by 'incr' parameter. 'incr' will normally have 1/-1 to navigate thru the months. */ var ret_arr = new Array(); if (incr == -1) { // B A C K W A R D if (p_Month == 0) { ret_arr[0] = 11; ret_arr[1] = parseInt(p_Year) - 1; } else { ret_arr[0] = parseInt(p_Month) - 1; ret_arr[1] = parseInt(p_Year); } } else if (incr == 1) { // F O R W A R D if (p_Month == 11) { ret_arr[0] = 0; ret_arr[1] = parseInt(p_Year) + 1; } else { ret_arr[0] = parseInt(p_Month) + 1; ret_arr[1] = parseInt(p_Year); } } return ret_arr; } function Calendar_print() { ggWinCal.print(); } function Calendar_calc_month_year(p_Month, p_Year, incr) { /* Will return an 1-D array with 1st element being the calculated month and second being the calculated year after applying the month increment/decrement as specified by 'incr' parameter. 'incr' will normally have 1/-1 to navigate thru the months. */ var ret_arr = new Array(); if (incr == -1) { // B A C K W A R D if (p_Month == 0) { ret_arr[0] = 11; ret_arr[1] = parseInt(p_Year) - 1; } else { ret_arr[0] = parseInt(p_Month) - 1; ret_arr[1] = parseInt(p_Year); } } else if (incr == 1) { // F O R W A R D if (p_Month == 11) { ret_arr[0] = 0; ret_arr[1] = parseInt(p_Year) + 1; } else { ret_arr[0] = parseInt(p_Month) + 1; ret_arr[1] = parseInt(p_Year); } } return ret_arr; } // This is for compatibility with Navigator 3, we have to create and discard one object before the prototype object exists. new Calendar(); Calendar.prototype.getMonthlyCalendarCode = function() { var vCode = ""; var vHeader_Code = ""; var vData_Code = ""; // Begin Table Drawing code here.. vCode = vCode + "<TABLE BORDER=1 WIDTH='100%' BGCOLOR=\"" + this.gBGColor + "\">"; vHeader_Code = this.cal_header(); vData_Code = this.cal_data(); vCode = vCode + vHeader_Code + vData_Code; vCode = vCode + "</TABLE>"; return vCode; } Calendar.prototype.show = function() { var vCode = ""; this.gWinCal.document.open(); // Setup the page... this.wwrite("<html>"); this.wwrite("<head><title>������� ��������</title>"); this.wwrite("</head>"); this.wwrite("<body dir=\"rtl\"" + "link=\"" + this.gLinkColor + "\" " + "vlink=\"" + this.gLinkColor + "\" " + "alink=\"" + this.gLinkColor + "\" " + "text=\"" + this.gTextColor + "\">"); this.wwriteA("<FONT FACE='" + fontface + "' SIZE=1 COLOR='#914848'><B>"); this.wwriteA(this.gMonthName + " " + this.gYear); this.wwriteA("</B><BR>"); // Show navigation buttons var prevMMYYYY = Calendar.calc_month_year(this.gMonth, this.gYear, -1); var prevMM = prevMMYYYY[0]; var prevYYYY = prevMMYYYY[1]; var nextMMYYYY = Calendar.calc_month_year(this.gMonth, this.gYear, 1); var nextMM = nextMMYYYY[0]; var nextYYYY = nextMMYYYY[1]; this.wwrite("<TABLE width='100%' BORDER=1 CELLSPACING=0 CELLPADDING=0 BGCOLOR='#EAF4D6'><TR><TD BGCOLOR='#EAF4D6' ALIGN=center><FONT FACE='Verdana' SIZE='1'>"); this.wwrite("[<A HREF=\"" + "javascript:window.opener.Build(" + "'" + this.gReturnItem + "', '" + this.gMonth + "', '" + (parseInt(this.gYear)-1) + "', '" + this.gFormat + "'" + ");" + "\"><<<\/A>]</B></FONT></TD><TD BGCOLOR='#EAF4D6' ALIGN=center><FONT FACE='Verdana' SIZE='1'>"); this.wwrite("[<A HREF=\"" + "javascript:window.opener.Build(" + "'" + this.gReturnItem + "', '" + prevMM + "', '" + prevYYYY + "', '" + this.gFormat + "'" + ");" + "\"><<\/A>]</FONT></TD><TD BGCOLOR='#EAF4D6' ALIGN=center><FONT FACE='Verdana' SIZE='1'>"); this.wwrite("[<A HREF=\"javascript:window.print();\">Print</A>]</FONT></TD><TD BGCOLOR='#EAF4D6' ALIGN=center><FONT FACE='Verdana' SIZE='1'>"); this.wwrite("[<A HREF=\"" + "javascript:window.opener.Build(" + "'" + this.gReturnItem + "', '" + nextMM + "', '" + nextYYYY + "', '" + this.gFormat + "'" + ");" + "\">><\/A>]</FONT></TD><TD BGCOLOR='#EAF4D6' ALIGN=center><FONT FACE='Verdana' SIZE='1'>"); this.wwrite("[<A HREF=\"" + "javascript:window.opener.Build(" + "'" + this.gReturnItem + "', '" + this.gMonth + "', '" + (parseInt(this.gYear)+1) + "', '" + this.gFormat + "'" + ");" + "\">>><\/A>]</FONT></TD></TR></TABLE><BR>"); // Get the complete calendar code for the month.. vCode = this.getMonthlyCalendarCode(); this.wwrite(vCode); this.wwrite("</font></body></html>"); this.gWinCal.document.close(); } Calendar.prototype.showY = function() { var vCode = ""; var i; var vr, vc, vx, vy; // Row, Column, X-coord, Y-coord var vxf = 285; // X-Factor var vyf = 200; // Y-Factor var vxm = 10; // X-margin var vym; // Y-margin if (isIE) vym = 75; else if (isNav) vym = 25; this.gWinCal.document.open(); this.wwrite("<html>"); this.wwrite("<head><title>������� ��������</title>"); this.wwrite("<style type='text/css'>\n<!--"); for (i=0; i<12; i++) { vc = i % 3; if (i>=0 && i<= 2) vr = 0; if (i>=3 && i<= 5) vr = 1; if (i>=6 && i<= 8) vr = 2; if (i>=9 && i<= 11) vr = 3; vx = parseInt(vxf * vc) + vxm; vy = parseInt(vyf * vr) + vym; this.wwrite(".lclass" + i + " {position:absolute;top:" + vy + ";left:" + vx + ";}"); } this.wwrite("-->\n</style>"); this.wwrite("</head>"); this.wwrite("<body " + "link=\"" + this.gLinkColor + "\" " + "vlink=\"" + this.gLinkColor + "\" " + "alink=\"" + this.gLinkColor + "\" " + "text=\"" + this.gTextColor + "\">"); this.wwrite("<FONT FACE='" + fontface + "' SIZE=2><B>"); this.wwrite("Year : " + this.gYear); this.wwrite("</B><BR>"); // Show navigation buttons var prevYYYY = parseInt(this.gYear) - 1; var nextYYYY = parseInt(this.gYear) + 1; //Here this.wwrite("<TABLE width='100%' BORDER=1 CELLSPACING=0 CELLPADDING=0 BGCOLOR='#B6DADA'><TR BGCOLOR='#B6DADA'><TD BGCOLOR='#B6DADA' ALIGN=center>"); this.wwrite("[<A HREF=\"" + "javascript:window.opener.Build(" + "'" + this.gReturnItem + "', null, '" + prevYYYY + "', '" + this.gFormat + "'" + ");" + "\" alt='Prev Year'><<<\/A>]</TD><TD ALIGN=center>"); this.wwrite("[<A HREF=\"javascript:window.print();\">Print</A>]</TD><TD ALIGN=center>"); this.wwrite("[<A HREF=\"" + "javascript:window.opener.Build(" + "'" + this.gReturnItem + "', null, '" + nextYYYY + "', '" + this.gFormat + "'" + ");" + "\">>><\/A>]</TD></TR></TABLE><BR>"); // Get the complete calendar code for each month.. var j; for (i=11; i>=0; i--) { if (isIE) this.wwrite("<DIV ID=\"layer" + i + "\" CLASS=\"lclass" + i + "\">"); else if (isNav) this.wwrite("<LAYER ID=\"layer" + i + "\" CLASS=\"lclass" + i + "\">"); this.gMonth = i; this.gMonthName = Calendar.get_month(this.gMonth); vCode = this.getMonthlyCalendarCode(); this.wwrite(this.gMonthName + "/" + this.gYear + "<BR>"); this.wwrite(vCode); if (isIE) this.wwrite("</DIV>"); else if (isNav) this.wwrite("</LAYER>"); } this.wwrite("</font><BR></body></html>"); this.gWinCal.document.close(); } Calendar.prototype.wwrite = function(wtext) { this.gWinCal.document.writeln(wtext); } Calendar.prototype.wwriteA = function(wtext) { this.gWinCal.document.write(wtext); } Calendar.prototype.cal_header = function() { var vCode = ""; vCode = vCode + "<TR>"; vCode = vCode + "<TD WIDTH='14%'><FONT SIZE='1' FACE='" + fontface + "' COLOR='" + this.gHeaderColor + "'><B>���</B></FONT></TD>"; vCode = vCode + "<TD WIDTH='14%'><FONT SIZE='1' FACE='" + fontface + "' COLOR='" + this.gHeaderColor + "'><B>�����</B></FONT></TD>"; vCode = vCode + "<TD WIDTH='14%'><FONT SIZE='1' FACE='" + fontface + "' COLOR='" + this.gHeaderColor + "'><B>������</B></FONT></TD>"; vCode = vCode + "<TD WIDTH='14%'><FONT SIZE='1' FACE='" + fontface + "' COLOR='" + this.gHeaderColor + "'><B>������</B></FONT></TD>"; vCode = vCode + "<TD WIDTH='14%'><FONT SIZE='1' FACE='" + fontface + "' COLOR='" + this.gHeaderColor + "'><B>����</B></FONT></TD>"; vCode = vCode + "<TD WIDTH='14%'><FONT SIZE='1' FACE='" + fontface + "' COLOR='" + this.gHeaderColor + "'><B>����</B></FONT></TD>"; vCode = vCode + "<TD WIDTH='14%'><FONT SIZE='1' FACE='" + fontface + "' COLOR='" + this.gHeaderColor + "'><B>���</B></FONT></TD>"; vCode = vCode + "</TR>"; return vCode; } Calendar.prototype.cal_data = function() { var vDate = new Date(); vDate.setDate(1); vDate.setMonth(this.gMonth); vDate.setFullYear(this.gYear); var vFirstDay=vDate.getDay(); var vDay=1; var vLastDay=Calendar.get_daysofmonth(this.gMonth, this.gYear); var vOnLastDay=0; var vCode = ""; /* Get day for the 1st of the requested month/year.. Place as many blank cells before the 1st day of the month as necessary. */ vCode = vCode + "<TR>"; for (i=0; i<vFirstDay; i++) { vCode = vCode + "<TD WIDTH='14%'" + this.write_weekend_string(i) + "><FONT SIZE='1' FACE='" + fontface + "'> </FONT></TD>"; } // Write rest of the 1st week for (j=vFirstDay; j<7; j++) { vCode = vCode + "<TD WIDTH='14%'" + this.write_weekend_string(j) + "><FONT SIZE='1' FACE='" + fontface + "'>" + "<A HREF='#' " + "onClick=\"self.opener.document." + this.gReturnItem + ".value='" + this.format_data(vDay) + "';window.close();\">" + this.format_day(vDay) + "</A>" + "</FONT></TD>"; vDay=vDay + 1; } vCode = vCode + "</TR>"; // Write the rest of the weeks for (k=2; k<7; k++) { vCode = vCode + "<TR>"; for (j=0; j<7; j++) { vCode = vCode + "<TD WIDTH='14%'" + this.write_weekend_string(j) + "><FONT SIZE='1' FACE='" + fontface + "'>" + "<A HREF='#' " + "onClick=\"self.opener.document." + this.gReturnItem + ".value='" + this.format_data(vDay) + "';window.close();\">" + this.format_day(vDay) + "</A>" + "</FONT></TD>"; vDay=vDay + 1; if (vDay > vLastDay) { vOnLastDay = 1; break; } } if (j == 6) vCode = vCode + "</TR>"; if (vOnLastDay == 1) break; } // Fill up the rest of last week with proper blanks, so that we get proper square blocks for (m=1; m<(7-j); m++) { if (this.gYearly) vCode = vCode + "<TD WIDTH='14%'" + this.write_weekend_string(j+m) + "><FONT SIZE='1' FACE='" + fontface + "' COLOR='gray'> </FONT></TD>"; else vCode = vCode + "<TD WIDTH='14%'" + this.write_weekend_string(j+m) + "><FONT SIZE='1' FACE='" + fontface + "' COLOR='gray'>" + m + "</FONT></TD>"; } return vCode; } Calendar.prototype.format_day = function(vday) { var vNowDay = gNow.getDate(); var vNowMonth = gNow.getMonth(); var vNowYear = gNow.getFullYear(); var oDay = (vday.toString().length < 2) ? "0" + vday : vday; var oMon = parseInt(this.gMonth)+1; oMon = (oMon.toString().length < 2) ? "0" + oMon : oMon; var oDate = oDay+"/"+oMon+"/"+this.gYear; // if (TYPE ==1) // { if (vday == vNowDay && this.gMonth == vNowMonth && this.gYear == vNowYear) return ("<FONT FACE=\"verdana\" SIZE=\"1\" COLOR=\"#914848\"><B>" + vday + "</B></FONT>"); else return (vday); /* } else { if (vday == vNowDay && this.gMonth == vNowMonth && this.gYear == vNowYear) return ("<FONT FACE=\"verdana\" SIZE=\"1\" COLOR=\"#914848\"><B>" + convDay(oDate) + "</B></FONT>"); else return (convDay(oDate)); } */ } Calendar.prototype.write_weekend_string = function(vday) { var i; // Return special formatting for the weekend day. for (i=0; i<weekend.length; i++) { if (vday == weekend[i]) return (" BGCOLOR=\"" + weekendColor + "\""); } return ""; } Calendar.prototype.format_data = function(p_day) { var vData; var vMonth = 1 + this.gMonth; vMonth = (vMonth.toString().length < 2) ? "0" + vMonth : vMonth; var vMon = Calendar.get_month(this.gMonth).substr(0,3).toUpperCase(); var vFMon = Calendar.get_month(this.gMonth).toUpperCase(); var vY4 = new String(this.gYear); var vY2 = new String(this.gYear.substr(2,2)); var vDD = (p_day.toString().length < 2) ? "0" + p_day : p_day; switch (this.gFormat) { case "MM\/DD\/YYYY" : vData = vMonth + "\/" + vDD + "\/" + vY4; break; case "MM\/DD\/YY" : vData = vMonth + "\/" + vDD + "\/" + vY2; break; case "MM-DD-YYYY" : vData = vMonth + "-" + vDD + "-" + vY4; break; case "MM-DD-YY" : vData = vMonth + "-" + vDD + "-" + vY2; break; case "DD\/MON\/YYYY" : vData = vDD + "\/" + vMon + "\/" + vY4; break; case "DD\/MON\/YY" : vData = vDD + "\/" + vMon + "\/" + vY2; break; case "DD-MON-YYYY" : vData = vDD + "-" + vMon + "-" + vY4; break; case "DD-MON-YY" : vData = vDD + "-" + vMon + "-" + vY2; break; case "DD\/MONTH\/YYYY" : vData = vDD + "\/" + vFMon + "\/" + vY4; break; case "DD\/MONTH\/YY" : vData = vDD + "\/" + vFMon + "\/" + vY2; break; case "DD-MONTH-YYYY" : vData = vDD + "-" + vFMon + "-" + vY4; break; case "DD-MONTH-YY" : vData = vDD + "-" + vFMon + "-" + vY2; break; case "DD\/MM\/YYYY" : vData = vDD + "\/" + vMonth + "\/" + vY4; break; case "DD\/MM\/YY" : vData = vDD + "\/" + vMonth + "\/" + vY2; break; case "DD-MM-YYYY" : vData = vDD + "-" + vMonth + "-" + vY4; break; case "DD-MM-YY" : vData = vDD + "-" + vMonth + "-" + vY2; break; default : vData = vDD + "\/" + vMonth + "\/" + vY4; } if (TYPE == 2) { vData = convDate(vData); } return vData; } function Build(p_item, p_month, p_year, p_format,type) { var p_WinCal = ggWinCal; gCal = new Calendar(p_item, p_WinCal, p_month, p_year, p_format,type); // Customize your Calendar here.. gCal.gBGColor="white"; gCal.gLinkColor="#27570E"; gCal.gTextColor="#27570E"; gCal.gHeaderColor="#27570E"; // Choose appropriate show function if (gCal.gYearly) gCal.showY(); else gCal.show(); } function show_calendar() { /* p_month : 0-11 for Jan-Dec; 12 for All Months. p_year : 4-digit year p_format: Date format (mm/dd/yyyy, dd/mm/yy, ...) p_item : Return Item. */ p_item = arguments[0]; if (arguments[1] == null) p_month = new String(gNow.getMonth()); else p_month = arguments[1]; if (arguments[2] == "" || arguments[2] == null) p_year = new String(gNow.getFullYear().toString()); else p_year = arguments[2]; if (arguments[3] == null) p_format = "DD/MM/YYYY"; else p_format = arguments[3]; TYPE = arguments[4]; vWinCal = window.open("", "Calendar", "width=232,height=190,status=no,resizable=no,top=200,left=200"); vWinCal.opener = self; ggWinCal = vWinCal; Build(p_item, p_month, p_year, p_format); } /* Yearly Calendar Code Starts here */ function show_yearly_calendar(p_item, p_year, p_format) { // Load the defaults.. if (p_year == null || p_year == "") p_year = new String(gNow.getFullYear().toString()); if (p_format == null || p_format == "") p_format = "DD/MM/YYYY"; var vWinCal = window.open("", "Calendar", "scrollbars=yes"); vWinCal.opener = self; ggWinCal = vWinCal; Build(p_item, null, p_year, p_format); } |