0

Alright, so I feel my issue is that of a really simple one. basically, I'v created a website, and am trying to use javascript to validate input, all of which initially was one. When input fields were left blank, an error would prompt and so forth. I haven't changed a single thing, and now no form of validation takes place, and it simply ignores my javascript. Any ideas?

Here's an example of the Javascript;

function validate(el){
var alphabets="abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ ";
var temp;

if (el.Full_Name.value == "") {
     alert("Cannot leave area field blank!");
     return false;
 }
}

for (var i=0;i<el.Full_Name.value.length;i++){
temp=el.Full_Name.value.substring(i,i+1)
if (alphabets.indexOf(temp)==-1){
alert("Sorry, your name contains a " + temp +", which is not allowed.")
return false
   }
  }

Here's the HTML:

<form name="testform" onSubmit="return validate(testform)">
<table width="650" border="0">

<tr>
 <td width="79" valign="top">
  <label for="Full_Name">Full Name<span class="required_star"> * </span></label>
 </td>
 <td width="289" valign="top">
  <input size="15" type="text" name="Full_Name" id="Full_Name" maxlength="50" value="" />
 </td>
</tr>
<tr>
 <td colspan="4" style="text-align:center">
  <input type="submit" value="Proceed"/>
 </td>
</tr></table>
</form>
  • Any errors in the Javascript console? – Barmar Sep 14 '15 at 00:41
  • Is your input actually in a form. – EasyBB Sep 14 '15 at 00:42
  • please post the HTML so we can have a better view. – Petros Kyriakou Sep 14 '15 at 00:43
  • I don't seem to be getting any errors in the console. It's just really frustrating me that it worked, and now all of a sudden, unless i accidentally changed something without realising – Philip Newton Sep 14 '15 at 00:53
  • `document.form.Full_Name.value` should be `document.forms.testform.Full_Name.value`. *document.forms* is a collection, you can access the members by name (if they have one) or index (the form you seek seems to be the first, so `document.forms[0]`). – RobG Sep 14 '15 at 01:03

2 Answers2

3

You can speed up/simplify things, a bit:

<form name="testform" onSubmit="return validate(this)">

Notice use of 'this' - it actually refers to form element itself...

JS:

 function validate(el) {
if (el.Full_Name.value == "") {
     alert("Cannot leave area field blank!");
     return false;
 }
}

Demo: http://jsfiddle.net/tv9hntkL/

P.S. Correct selector in your case, would be: (document.testform.Full_Name.value == "")

sinisake
  • 11,240
  • 2
  • 19
  • 27
  • Thanks for the response! I just tried to implement this as you have done, and still no luck. On selection of the submit button it just proceeds as if theres no javascript whatsoever – Philip Newton Sep 14 '15 at 01:01
  • @Philip Newton, One syntax error (at least), check it now: http://jsfiddle.net/tv9hntkL/1/ Redundant closing bracket '}' was problem.... – sinisake Sep 14 '15 at 01:20
  • Worked absolutely incredibly. Just one more follow question if it's alright? If i wanted to validate that the user's input was lets say, more than 5 characters long, how would i go about doing that? – Philip Newton Sep 14 '15 at 01:29
  • Np, glad it worked, finally. To limit length, you can do something like this: http://jsfiddle.net/tv9hntkL/2/ – sinisake Sep 14 '15 at 01:33
  • You've been exceptionally helpful! I don't want to bother you with another question, but i feel it is necessary hahah! If i later wanted to input radio buttons, or the likes of a drop-down menu, is validation possible for this? – Philip Newton Sep 14 '15 at 01:44
  • Of course: http://stackoverflow.com/questions/10339073/radio-button-validation-in-javascript http://stackoverflow.com/questions/15368172/javascript-dropdown-validation.... – sinisake Sep 14 '15 at 01:46
1

You are accessing the form input wrong.

var myForm =  document.forms.<form-name>;
myForm.<input-name>.value; // holds the value of a certain input

will give you access to the value correctly.

Petros Kyriakou
  • 5,214
  • 4
  • 43
  • 82