doubt with client side javascripting

Question

akulkarni 0 Junior Poster

15 Years Ago

i am trying to help a friend on a program on client side scripting using javascript.
i have the following code but i am not getting the output desired.

<html>
<head>
<Script language="JavaScript">

 var usernameVal;
if(document.f1.usernameVal.value.length<3)
{ 
 alert("username is invalid")
 
 return false;
}
else
{
 alert("acceptable")
}
</script>
</head>
<body>
<form name="f1" method="post">
Username:
<input type="text" name=user value="">
<input type="submit" value="submit">

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

can somebody please modify this code and help me get a simple basic solution.i am not sure about form name f1, how to get value to usernameVal and then the post and submit. i have tried everywhere on net but in vain.I know basic javascript but not the client side scripting.

javascript

3 Contributors
12 Replies
121 Views
19 Hours Discussion Span
Latest Post 15 Years Ago Latest Post by Troy III

ShawnCplus 456 Code Monkey

15 Years Ago

A) Use <script type="text/javascript> , not <Script language="JavaScript"> , it's old and the language attribute is deprecated
B) Your code doesn't actually do anything since it's never called (or at least, it'll always fail as soon as the page loads
C)

<head>
<script type="text/javascript">
var validateUsername = function ()
{
  var element = document.getElementById('username');
  if (element.value.length < 3) {
    alert('Invalid Username');
    return false;
  } else {
    alert('Acceptable');
    return true;
  }
};
</script>
</head>
<body>
<form name="f1" method="post" onsubmit="return validateUsername();">
  Username: <input type="text" id="username" name="user" />
  <input type="submit" value="submit" />
</form>
</body>
</html>

Edited 15 Years Ago by ShawnCplus because: n/a

ShawnCplus 456 Code Monkey

15 Years Ago

w3schools.com is your friend

ShawnCplus 456 Code Monkey

15 Years Ago

i tried the program using this
<html>
<body>

<script type="text/javascript">
var patt1=new RegExp("@","!");// or even just @


document.write(patt1.test("nik@123l#!"));
}

</script>

</body>
</html>
i do not get an output ..help.... how to i check for all special characters

var somestring = "Hello!@World, I have ^Spe_cial[ Chars";
if (!/^\w+$/.test(somestring)) {
  alert('Bad Username');
} else {
  alert('Good Username');
}

Reply to this topic

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.

akulkarni 0 Junior Poster · Answer 1 · 2009-09-26T00:48:42+00:00

thanks dude. i had little resources available with me. hope to be in touch with you that friend might come up with more doubts

akulkarni 0 Junior Poster · Answer 2 · 2009-09-26T01:26:49+00:00

i saw this on http://docs.sun.com/source/816-6409-10/ but not working. I have to allow a username that will not contain special charachters that is only alphabets and numbers are allowed. here is the code

<html>
<head>
<script type="text/javascript">
var x=function()
{
 var ch=document.getElementById('ch1');
 if((ch=='/\w/')||(ch=='/\W/'))
{
 alert("not allowed ");
 return false;
}
else
{
 alert("allowed");
 return true;
}
};
</script>
</head>
<body>
<form name="f1" method="post" onsubmit="return x();">
username:<input type="text" id="ch1" name="user"/>
<input type="submit" value="submit"/>
</form>
</body>
</html>

it is not working.Can u suggest any links where i can study various conditions ("if" for eg). i am still on the link given above(working on it). She has usernames for her syllabus and thus the various conditions.

i am on this link http://docs.sun.com/source/816-6409-10/regexp.htm#1008713

akulkarni 0 Junior Poster · Answer 3 · 2009-09-26T02:00:14+00:00

quite good..checking..may need ur help even then:(

akulkarni 0 Junior Poster · Answer 4 · 2009-09-26T02:59:32+00:00

i tried the program using this

<html>
<body>

<script type="text/javascript">
var patt1=new RegExp("@","!");// or even just @


document.write(patt1.test("nik@123l#!"));
}

</script>

</body>
</html>

i do not get an output ..help.... how to i check for all special characters

Troy III 272 Posting Pro · Answer 5 · 2009-09-26T06:18:46+00:00

i am trying to help a friend on a program on client side scripting using javascript.
i have the following code but i am not getting the output desired.
<html>
<head>
<Script language="JavaScript">

 var usernameVal;
if(document.f1.usernameVal.value.length<3)
{ 
 alert("username is invalid")
 
 return false;
}
else
{
 alert("acceptable")
}
</script>
</head>
<body>
<form name="f1" method="post">
Username:
<input type="text" name=user value="">
<input type="submit" value="submit">

</form>
</body>
</html>
can somebody please modify this code and help me get a simple basic solution.i am not sure about form name f1, how to get value to usernameVal and then the post and submit. i have tried everywhere on net but in vain.I know basic javascript but not the client side scripting.

Let's examine what you have than...
First: the code is running before the form of the document is even loaded. [you've put the plain script in the document header instead of at the bottom of the body]

Second: your "var usernameVal; is declared only! - But undefined...

Third: your conditional "if(document.f1.usernameVal.value.length<3)" is completely invalid
document.f1.usernameVal part, means nothing to the knowledge of js engine. And being "undefined" would always return length of 9, and falsely validate your form.

Fourth: you have a statement "return false" which is out of the function and will produce error while being parsed and before any execution takes place. Cause at the end there is nothing awaiting to receive your "return" statement there.

Fifth: Your code will execute during load time and will not wait for submit

This will work:

<html>
<head>

</head>
<body>
<form name="f1" method="post">
Username:
<input type="text" name=user value="">
<input type="submit" value="submit">

</form>

<Script language="JavaScript">

 var usernameVal = document.forms.f1.user.value.length;
 
if(usernameVal < 3)
{ 
 alert("username is invalid")
 
 //return false;
}
else
{
 alert("acceptable")
}
</script>
</body>
</html>

but you should instantiate the function first as:
function validatef1(){...the code described (!!removing the comment from return false) and assigning it to the submit. to prevent it from running during load time and never again and so that your return would have a destination where to put the value so the form doesn't get submitted regardless the conditional outcome.

akulkarni 0 Junior Poster · Answer 6 · 2009-09-26T07:57:02+00:00

ok i will go through it in a relax mood now that i know the format.
thanks anyways i will need it

akulkarni 0 Junior Poster · Answer 7 · 2009-09-26T08:05:26+00:00

Dear codeLion,

u gave me the solution thanks. But i might need such things regularly. I had shown u a link in which all this was there but i could not understand.Can u tell me how generally i can master such usernames and other queries.Tell me how u manipulated the string(the condition).so that i can explain it to her(her name is pooja she is from india..me too) and so that she too can get a grip and score good for a better college ..your help will be great!

i hope i am clear, thanks.

with love,
nikhil

ShawnCplus 456 Code Monkey Team Colleague · Answer 8 · 2009-09-26T08:52:25+00:00

Dear codeLion,
u gave me the solution thanks. But i might need such things regularly. I had shown u a link in which all this was there but i could not understand.Can u tell me how generally i can master such usernames and other queries.Tell me how u manipulated the string(the condition).so that i can explain it to her(her name is pooja she is from india..me too) and so that she too can get a grip and score good for a better college ..your help will be great!
i hope i am clear, thanks.
with love,
nikhil

They're called regular expressions and they're the best thing since sliced bread. http://www.regular-expressions.info/

Troy III 272 Posting Pro · Answer 9 · 2009-09-26T12:56:01+00:00

ok i will go through it in a relax mood now that i know the format.
thanks anyways i will need it

As i understand you are server side...
Just keep in mind that everything outside the body function and inside the script tag gets executed in place and as being read. So putting commands that manipulate or depend on the document content in a header, will always return undefined or rise errors, since the DOM is still not ready and you are targeting elements before they are created.

Another thing is that if you don't construct functions that will hold those instructions and commands in the function body they are all one-time only - they execute and they die instantly and can't be referenced anymore as they'll be garbage collected automatically.

Now taking the same code and turning it into a defined function would go like this:

<script language="JavaScript">
function validateF1(){
       var usernameVal = document.forms.f1.user.value.length;
if(usernameVal < 3){ 
      alert("username is invalid")
      return false;
     }
else{
      alert("acceptable")
     }
}
</script>

This will make it possible to put it back on the document header again without problems.

And than, if, and when needed call it from the contextual element in the form, as you already did somewhere: <form name="f1" method="post" onsubmit="return validateF1()"> This will keep you going on the right direction...

Regards