HTML and javascript question. text box and button validation with javascript.?

Question

I am trying to do a validation on some text boxes. Upon hitting the submit button I want to check to see if the text boxes are null or not. below in my javascript where I am just messing with the first box (I didn't yet write anything for the 2nd box yet.) But when I type in something it keeps on coming up if the value is null or isn't null. Can anyone help?

Here is my HTML

Enter your First Name


Enter your Last Name


Enter your email

Here is my Javascript

function getValues()
{
var fname = document.getElementById("fname");
var fname = document.getElementById("lname");
var fname = document.getElementById("email");



if(fname == " ')
{
alert("your first name is empty")
}

}

Answer 1

Your main problem is that you are using the same variable name for all three inputs. (Er, copy and paste has a few drawbacks :( ). Also you need to add ".value" after "getElementById()".



An alternative way of getting the values of the variables is to pass the form to the function, as in the following:




"http://www.w3.org/TR/html4/loose.dtd" >

Validate Input

Enter your First Name




Enter your Last Name




Enter your email

I've also made a few other changes.



Instead of
, I've used
.
would be a closing tag, but the
has no closing tag. You may be thinking of the XHTML version which is
, that is a self closing tag.



The input tag also has no closing tag. Instead I've used the tag to note the label for each input tag. This has the added advantage that if the visitor clicks on the label the input is selected.



For more on the input tag see: http://www.html-tags-guide.com/html-label-tag.html

Answer 2

This:

var fname = document.getElementById("fname");

var fname = document.getElementById("lname");

var fname = document.getElementById("email");



I suppose it assigns to the variable fname the contents of the textbox fname, the textbox lname then textbox email, so by the time you check the variable fname (if (fname == "")) it contains whatever the email textbox contains. If you left that empty, the alert will keep coming up, no matter what you have in the fname textbox.



Pay attention.



edit:

Also, needs to go in the section, not before it.









As far as I know, the tag doesn't have a matching . If you want some text to appear next to the textbox, just put it there, like this:



First name:

<_br />







Or if you want some text to appear inside the textbox, use the value attribute:



First name:

<_br />







That way, the textbox will be filled with "text inside textbox" by default.



Where you see <_br /> just delete the underscore -- without the underscore, Yahoo inserts a blank line -- that's not supposed to happen.

Answer 3

Validation In Javascript For Textbox

Answer 4

you should not use the " ' you should use something like "" or '' in this script



if(fname == "") // it was if(fname == " ')

{

alert("your first name is empty")

}



}



sorry for my quick hasty reply earlier, i just checked everything out, also the fname is repeatitve, so here the answers shows for the email because you have fname written instead of lname and email



also the value field is missing after the getElementById





so the complete script should be like:

function getValues()

{

var fname = document.getElementById("fname");

var lname = document.getElementById("lname");

var email = document.getElementById("email");



if(fname.value =="")

{

alert("your first name is empty");

}

}

Answer 5

to simplify what i think everyone else is trying to say is that you have to stay on the same page. The submit button is meant to submit information back to the server. If you want to use purely html and javascript, change the submit button to just a button with the attribute onclick="somefunction()". you can then make somefunction() that will change the output displayed on the page. One way would be using javascript to collapse or insert rows into an html table.