JavaScript - Problem Validating Text Area For Form
Hi, I'm a student learning web design and having a problem with some javascript code, I'm validating a text area, i dont have a problem limiting how many characters can be typed in the textarea, but I cant get it to give an error if there is no text in the text area.
In the code below the validateMes() function is not working, the other functions work fine Javascript code: Code: function validateLimit(fld){ var error =""; if(fld.value.length > 300){ error = "Cannot exceed 300 characters.\n" fld.style.background = 'Yellow'; }else{ fld.style.background = 'White'; } return error; } function validateMes(fld) { //this function not working var error = ""; if (fld.value.length == 0) { fld.style.background = 'Yellow'; error = "The Message field has not been filled in.\n" } else { fld.style.background = 'White'; } return error; } function validateFormOnSubmit(form1) { //master validating function var reason = ""; reason += validateLimit(form1.mess); reason += validateMes(form1.mess); if (reason != "") { alert("Some fields need correction:\n" + reason); return false; }else{ alert("Message has been submitted"); return true; } } Html form code: Code: <form name="form1" id="form1" onsubmit="return validateFormOnSubmit(this)" > <div class="box"> <h1>CONTACT FORM :</h1> <label> <span>Full name</span> <input type="text" class="input_text" name="name" id="name" value=""/> </label> <label> <span>Email</span> <input type="text" class="input_text" name="emailbox" id="emailbox" value=""/> </label> <label> <span>Subject</span> <input type="text" class="input_text" name="subject" id="subject" value=""/> </label> <label> <span>Message</span> <textarea class="message" name="mess" id="mess" ></textarea> <span>*Message limited to 300 characters</span> <input type="submit" class="button" value="Submit Form" /> </label> </div> </form> I can't see what I'm doing wrong, would really appreciate some help Thanks Similar TutorialsHello, I have 2 things I'm trying to figure out. 1. First form on the page has questions with radio buttons. Each radio's value is a number so a score is assessed at the end. 2. Second form on the page is an email the admin form, which duplicates the score in one field. Question: I would like to know how to write the form results to a text area in second form. However, I can't do this for one, and secondly, the value is a number, can I use labels? Here's the code I've 'made up' so far... JS (i know it's wrong) Code: <script LANGUAGE="JavaScript" type="text/javascript"> function display() { message = "<ul><li><b>Question 1: </b>" + document.quizform.Q1.label; message = "<li><b>Question 2: </b>" + document.quizform.Q2.label; message = "<li><b>Question 3: </b>" + document.quizform.Q3.label; message = "<li><b>Question 4: </b>" + document.quizform.Q4.label; message = "<li><b>Question 5: </b>" + document.quizform.Q5.label; message = "<li><b>Question 6: </b>" + document.quizform.Q6.label + "</ul>"; document.write(message); } </script> Form field example: Code: Question 1:<BR> <label for="Yes"><input type="radio" name="Q1" value="0" checked></label>Yes<br> <label for="No"><input type="radio" name="Q1" value="10"></label>No<br> <label for="I don't know"><input type="radio" name="Q1" value="10"></label>I don't know<br> I'll admit I'm new to javascript, so my apologies if this looks like crap. Code: Taken out due to fix I'm trying to get this javascript to return a level to this form field. Code: taken out, due to fix Hello all I'm working on a simple feedback form (well not so simple for me) for the last page of my site. In the text area I expect to get normal western text PLUS (or even just) Chinese xharacters my question is how do you validate Chinese character input? low tech I am running some javascript code which generates a popup window associated with a spell checking program. The way the program works, is that it takes the text out of a text field (passed as an object), spell checks the string, then puts it back into the text area field. My text area is located within a flash form, and I am having trouble pointing to it. I am sure my spell checking program is working, as it works fine if I point to an html text area. Do I have to do something special to point to a flash form object? Here is my code: Code: <!--- Source the JavaScript spellChecker object ---> <script language="javascript" type="text/javascript" src="../Spellchecking/spellerpages-0.5.1/speller/spellChecker.js"> </script> <!--- Call a function like this to handle the spell check command ---> <script language="javascript" type="text/javascript"> function openSpellChecker() { // get the textarea we're going to check <!--- pointer to text area ---> var txt = window.activity.Summary; // give the spellChecker object a reference to our textarea // pass any number of text objects as arguments to the constructor: var speller = new spellChecker( txt ); // kick it off speller.openChecker(); } </script> Also, here is my text area: Code: <cfform format="flash" id="activity1" height="#formheight#" width="100%" style="#formstyle#" timeout="3600" wmode="transparent" name="activity" onLoad="#initVars#; onFormLoad();"> <cftextarea name="Summary" id="Summary" html="yes" maxlength="1000" tooltip="Summarize your entry here. The field has a 1000 character limit. This summary is included in the generated End of the Week reports." onChange="submitTemporary('Summary', Summary.text);requiredContent('summary');" onFocus="if(detailsBox.height>60){detailsBox.height=60;summaryBox.height=220;}"></cftextarea> </cfform> Any help on this issue would be much appreciated. Thanks, AeroNicko As of right now I have a code that will work in IE but wont work in FireFox...go figure. Basically what I want to have happen is when you type in an area code it will provide an output in a predetermined area of the page. For Example: Input- 512 Output - Austin, TX The code that I have doesn't work with firefox and I was just wondering if there was a code that would allow that to happen. Thanks! Hi, I have a form setup so that selecting a radio button opens a specific text field. The problem is if the user starts to enter information, then switches to a different radio button (perhaps they chose the wrong radio to start), the text they already started to enter on the previous textfield doesn't get cleared. This will be a problem later when inserting to sql. Here is a summary of the code: Code: <head> <script type="text/javascript"> function doClick(objRad){ if (objRad.value=="0"){ document.getElementById("textbox").style.display='block'; } else{ document.getElementById("textbox").style.display='none'; } if (objRad.value=="1"){ document.getElementById("textbox1").style.display='block'; } else{ document.getElementById("textbox1").style.display='none'; } if (objRad.value=="2"){ document.getElementById("textbox2").style.display='block'; } else{ document.getElementById("textbox2").style.display='none'; } } </script> </head> <body> <form action="insert.php" method="post"> <p>Please choose the business type: <input type="radio" name="rad" value="0" onclick="doClick(this)"> Sole Proprietorship <input type="radio" name="rad" value="1" onclick="doClick(this)"> Partnership <input type="radio" name="rad" value="2" onclick="doClick(this)"> Corporation <div id="textbox" style="display:none"> <input type="text" name="txt"> This is my sole proprietorship info.</div> <div id="textbox1" style="display:none"> <input type="text" name="txt"> This is my partnership info.</div> <div id="textbox2" style="display:none"> <input type="text" name="txt">This is my corporation info. </div> </form> </body> Any help is appreciated, Thanks in advance! im clueless when it comes to javascript, but this is what im trying to find: i have a page that has multiple text areas, i also have 4 links that when clicked i want to add some predefined text into the active text area the one with the text cursor in? The Hyperlinks: Code: <a href="#sc">Shift Changed</a> | <a href="#ol">On Leave</a> | <a href="#ot">OverTime</a> | <a href="#ss">ShiftSwap</a> The textareas: PHP Code: <td><textarea name=details$i rows=4 align=absmiddle cols=16 value="$details[$i]\">$details[$i]</textarea></td> as you can see the textareas are created on the fly based on a php array. would anyone be willing to put some code together for this? or even give me the basics on how i can get the active textarea's name so i can pass that to a script that inserts into a given field? hey im new to javascript and im working in this function , i can't get it work here is my code PHP Code: <SCRIPT LANGUAGE="JavaScript"> function text(form1) { var j = document.form1.diary.value; j = j.italics(); document.form1.diary.value = j ; } </SCRIPT> whats the problem ? Hi, I am wanting to insert text into a text area when a button or link is clicked. I know how to replace the whole lot in the text area, but I want it to insert text where the flashing cursor is in the text box. (Like Wikipedia) If any one can help, Then I will be very, very greatfull. Thank You. I managed to create the form that asks you to type in the information but I'm having some difficulty trying to figure out the alert to say "Thank you " after you have everything filled in and then hitting the button. my code is Code: <HTML> <HEAD> <TITLE> Form Validation Example </TITLE> <SCRIPT LANGUAGE="JavaScript"> function validatePersonalInfo(){ var _first = document.info.fname.value; var _city = document.info.city.value; var _phone = document.info.phone.value; if(_first.toString() == ""){alert("Please enter a first name.");} if(_city.toString() == ""){alert("Please enter your city.");} if(_phone.toString() == ""){alert("Please enter your phone number.");} var phoneInput = document.info.phone.value; var validPhone = false; var validCity = false; if(checkCity == true){ validCity = true; } else{ if(!checkPhone(phoneInput)){ alert("Phone number is invalid." + validPhone); } else{ validPhone = true; } if(validCity && validPhone){ alert("Your form has been verified"); } } } function checkPhone(str){ var regexp = /^(\d{10}|\d{3}-\d{3}-\d{4}|\(\d{3}\)\d{3}-\d{4})$/; return regexp.test(str); } function checkNum(length){ var cityLet = parseInt(cityEntry, 10); if (document.info.city.value.length == length){ if(cityLet != 0 && isNaN(cityLet) == false){ return true; } else { return false; } } else { return false; } } </script> </head> <body> <p> <form name="info" action="" method="post"> <table> <tr><td align="left">First Name:</td> <td align="left"> <input type="text" name="fname" size=15> </td> </tr> <br> </tr> <br> <tr> <td align="left">City:</td> <td align="left"> <input type="text" name="city" size=15> </td> </tr> <br> <tr><td align="left">phone</td> <td align="left"> <input type="text" name="phone" size=20></td> </tr> <br> </tr> <br> </table> <center> <input type="button" value="Submit" onClick="validatePersonalInfo()"> </center> </form> </body> </html> the help is greatly appreciated So I'm working with a code that I can't seem to get the translation to show up in the text area. The user is supposed to enter text in a text area on the left hand side, hit the translation button, and the translation will appear like a sentence in the right hand text area. I don't seem to be able to get anything to show up in the right hand text area........ I know that i'ts probably something very simple that I am not seeing because at this point I am brain dead. Code: phrases = [["hello","ahoy"],["pardon me","aaarrgghh"],["excuse me","aarrr"], ["hows it going","hows it goin"],["sir","matey"],["madam","proud beauty"], ["woman","beauty"],["children","sprogs"],["where is","whar be"], ["can you help me find","know ye"], ["is that","be that"],["how far is it to?","how many leagues to"], ["the","th'"],["my","me"],["your","yer"],["there","thar"], ["outstanding","outstandin"],["attractive","attractive"],["happy","horny"], ["dead","went t' Davy Jones' locker"],["restroom","head"],["restaurant","galley"], ["hotel","fleabag inn"],["pub","pub"],["I would like to","I be needin' t"], ["I desire","I desire"],["I wish I knew how to","I'm a hankerin' t"], ["my mother told me to","MeAhoy! ol' mum, bless her black soul, always tol' me t"], ["have a great dinner","have a great what crawled out o' t' bung hole"], ["have a cocktail","swill a pint or two o' grog"],["fall on the ground","fall on t' ground"], ["get drunk","get splice t' mainbrace"]]; function Translate(text) { for(var i = 0; i < phrases.length; i++) { var toReplace = new RegExp("\\b"+ phrases[i][0]+"\\b", "i"); var index = text.search(toReplace); while(index != -1) { text = text.replace(toReplace, phrases[i][1]); index = text.search(toReplace); } } return text; } Code: <div> <textarea id="first_text" style="float:left" id="task_list" rows="20" cols="53"></textarea> <button id="translated" width="50px" heigth="100px" ><img src="pirate2.gif" />Translation----></button> <textarea id="second_text" style="float:right" id="task_list" rows="20" cols="53"></textarea> </div> Here's what I have so far in my validation part. However, I need help as to how to validate the following fields when the user clicks the submit button. -Radio Button *title (4 options) *member (3 options) *vegetarian (2 options) -Drop down lists *regstartdate (3 options) *regenddate (3 options) *confdinner (2 options) *paymethod (3 options) -UK Post Code (text box with maxlength=8) My current code shows 1 popup with all the error messages. Here's what I have so far: Redacted HI to all I am new be and not able to resolve the issue when i tries to edit text area everything works fine for crome and ie but does not work for firefox in fire fox when i try to edit intially everythings works fine but if i click other feild in form and after that try to edit text area backspace key stuck up and does not work please help me ?? code which i am using is menitoned below function stopPropagation(e) { e = e||event; /* get IE event ( not passed ) */ e.stopPropagation? e.stopPropagation() : e.cancelBubble = true; } function checkShortcut(e) { stopPropagation(e); if({8:1,13:1}[e.keycode||e.which]) { if( x ) return true; return false; } } Hello, I have a form which asks for some user data and then submits this data and inserts into a mysql database. I wanted to know the best way to validate the form before the data is submittted to the action script. For example, checking form fields to see if they are empty and also making sure no special characters are inserted by the user. The code I have tried is: Code: function checkForm() { var theForm = document.forms.feedback; if (theForm.fname.value == "" || theForm.loc.value="" || theForm.com.value == "") { alert("Please complete all of the form"); } } Working with this form: Code: <form id="feedback" name="feedback" action="php/phpcustom.php" method="POST"> <fieldset> <legend>Gardenable.com Feedback</legend> <p><label for="fname">Name:</label><input type="text" size="30" maxlength="40" id="fname" name="fname" /></p> <p><label for="loc">Location:</label><input type="text" size="30" maxlength="40" id="loc" name="loc" /></p> <p><label for="com">Comments:</label><textarea cols="40" rows="6" maxlength="300" id="com" name="com"></textarea></p> <p><input type="submit" name="send" id="submitbutton" value="Submit" onclick="checkForm()" /><input type="reset" name="reset" value="Reset" /></p> </fieldset> </form> I've added this function to the onclick attribute of the submit input button but it is just submitting the data and not executing. Just wondering if anyone could please explain how to stop the execution of the data being submitted and check the form before doing so. If not could you possibly advise any good sites/links for me to browse to achieve this. regards, LC. Hi, Please this form code is not working,please help correct me with the right code. When i did not enter anything onthe field require ,thealert does not pop up making the form inaccurate. Code: <script type="text/javascript"> function validateForm() { function CheckEmail() var x=document.frmone.email.value; var atpos=x.indexOf("@"); var dotpos=x.lastIndexOf("."); if(atpos<1 || dotpos<atpos+2 ||x.length>30){ alert("not a valide email address"); return false } function CheckUsername() { var x=document.frmone.fname.value; if(x==null || x==""){ alert("username is required"); return false } } </script> <form name="frmone" method="post" action="" onsubmit="validateForm()"/> <input type="text" name="email"/> <input type="submit" name="submit"/> <input type="text" name="fname"/> <input type="submit" name="submit"/> </form> Help me. Thanks. Clement Osei. Hi, i want to open a file in a text area, such that the user can either browse for a file and when selected it will open in a text box on the page, or the user can select a file from a list of active links on the page and this will open in the text area. I am new to java and dont know where to start on this, i have been browsing resources on the internet but have not found anything to get me started, would anybody be able to help? Thanks Need help with my text box. I want to make it so if i have several text boxes only one number can be entered once. So if i type the number 15 in the first text box and type 15 in the second text box an error will occur saying you cant enter the same number twice. Any idea how to do this? Code: <html> <head> <title>Untitled Document</title> <script> function checkForInvalid(obj) { obj.value = obj.value.replace(/[^0-9\-]|(-{2,})/gi, (RegExp.$1.indexOf("-") > -1) ? "-" : ""); } </script> </head> <body> <form name="myForm"> <input type="text" name="one" onkeyup="checkForInvalid(this)"> <br> <input type="text" name="two" onkeyup="checkForInvalid(this)"> <br> <input type="text" name="three" onkeyup="checkForInvalid(this)"> </form> </body> </html> Thanks I have a need to display, edit and save the contents of a text area to a text file or what ever is best suited, directly to the website root or folder within the root of the site. Is there anyway this can be done with out database software? As I dont have the option to install mysql or any other software to the webserver. Any help would be greatly appreciated. Thx Just a little backround: The webserver is acually an open source linux firewall which i was able to edit the apache config file to host a second site. I just want the ability to store edit and display some network information within a very small site I made without the use of a database. Is this even possible? Hello im trying to update a text area value with edited code with javascript, i dont know how to and im asking if you guys know
Hi, I have a text area that I want to add simple html formatting buttons to. The user should be able to: - highlight text and click a 'bold' button - highlight text and click 'itallic' button - Add bulleted list - Link I've looked at a number of WYSIWYG javascript examples, but they seem to accept Microsoft Word formatting, which I dont want. |