Javascript Validating username Length

Question

I am trying to validate my username field and check if the username contains atleast 6 letters, if not then i show a pop up window indicating the same. But the alert command does not seem to work.

Following is the code:

<html>
<head>
<title> Webpage </title>
</head>
<script language="Javascript">
function validate()
{

if (username1.length < 6)
{
alert("Username must be atleast 6 charactrs long, Please Try Again");
}

}


</script>
<body>
<form>
<center>
 <fieldset>
<table cellspacin="5" cellpadding="5" border="0">

<tr>
<td>Username: </td>
<td align="left"><input type=="text" name="username1" maxlength="20" size="20">
</td>
</tr>

<tr>
<td> Password: </td>
<td align = "left"> <input type="text" name="password" maxlength="20" size="20">
</td>
</tr>

<tr>
<td> Please confirm your password: </td>
<td align = "left"> <input type="text" name="password1" maxlength="20"        size="20">
</td>
</tr>

<tr>
<td align="center"><input type="submit" value="Log in" onClick="validate()">
</td>
</tr>
</fieldset>
</table>

</center>
</form>
</body>
</html>

You're trying to access username1, but aren't grabbing the the value from the input. Try using document.getElementByName("username1").value — william.taylor.09, Nov 17 '15 at 20:41
`username1` is an undefined variable in the context of `username1.length`. — Sparky, Nov 17 '15 at 20:41
@user5113176 I edited my comment above to indicate how you could accomplish this. I would recommend checking out http://www.w3schools.com/jsref/prop_text_value.asp for more information. — william.taylor.09, Nov 17 '15 at 20:43
Looks like you have a typo, I'm assuming that `type=="text"` should be `type="text"`? — Spencer Wieczorek, Nov 17 '15 at 20:46
Yes, lots of little issues here. Some would be easier to spot with proper indentation and spacing. [Do NOT use Allman style formatting in JavaScript](http://stackoverflow.com/a/11247362/594235) and check HTML at the W3C validator. — Sparky, Nov 17 '15 at 21:16

score 3 · Accepted Answer · answered Nov 17 '15 at 20:45

3

You are trying to use the name element attribute as the id, which creates a global window property. Name does not do that however, you can use. You also aren't getting the value, you are trying to get the length on the element.

document.getElementsByName('username1')[0].value

answered Nov 17 '15 at 20:45

Olavi Sau

1,647
13
20

I also tried another way that worked for me. I have edited my original post with the answer – user5113176 Nov 17 '15 at 20:57
@user5113176, do not edit post with the answer. Instead, post your own answer below. – Sparky Nov 17 '15 at 21:16
Sorry, Will do that now – user5113176 Nov 17 '15 at 21:17

score 0 · Answer 2 · answered Nov 17 '15 at 21:18

Answer: I tried it this way it worked:

       <html>
       <head>
      <title> Webpage </title>
     </head>
      <script language="Javascript">
     function validate()
     {

     username2 =form1.username1.value

    if (username2.length < 6)
    {
    alert("Username must be atleast 6 charactrs long, Please Try Again");
    } 

   } 


  </script>
  <body> 
  <form name="form1">
   <center>
  <fieldset>
  <table cellspacin="5" cellpadding="5" border="0">

 <tr>
 <td>Username: </td>
 <td align="left"><input type=="text" name="username1" maxlength="20" size="20">
 </td>
 </tr>

 <tr>
 <td> Password: </td>
 <td align = "left"> <input type="text" name="password" maxlength="20" size="20">
 </td>
 </tr>

 <tr>
 <td> Please confirm your password: </td>
 <td align = "left"> <input type="text" name="password1" maxlength="20" size="20">
 </td>
 </tr>

 <tr>
  <td align="center"><input type="submit" value="Log in"  onClick="validate()">
 </td>
 </tr>
 </fieldset>
 </table>

 </center>
 </form>
 </body>
 </html>

username2 =form1.username1.value This is what i added to the code to make it run. — user5113176, Nov 17 '15 at 21:20

Javascript Validating username Length

2 Answers2