www.webdeveloper.com
Results 1 to 6 of 6

Thread: jscript help(form validation)

  1. #1
    Join Date
    Nov 2013
    Posts
    2

    jscript help(form validation)

    this code doesnt seem to be working, label shows fora second then its gone

    function validate(){


    getUser=document.getElementById("username");
    getLabel=document.getElementById("labelUser");


    if
    (getUser.value.length>=5){
    getLabel.innerHTML="Valid username";
    getLabel.style.color="green";
    return true;
    }

    else{
    getLabel.innerHTML="invalid username";
    getLabel.style.color="red";
    return false;
    }






    <form onsubmit="return validate()">

    <input id="username" type = "text"/>
    <input type="submit" value="submit"/>
    <br/>
    <label id="labelUser" for="username"></label>

    </form>

  2. #2
    Join Date
    Oct 2013
    Posts
    484
    Code:
    <!DOCTYPE html>
    <html lang="en">
    <head>
    
    	<meta charset="utf-8">
    
    	<script>
    	function validate(){
    		var getUser=document.getElementById("username");
    		var getLabel=document.getElementById("labelUser");
    		if(getUser.value.length>=5){
    			getLabel.innerHTML="Valid username";
    			getLabel.style.color="green";
    			return false;
    		}
    		else{
    			getLabel.innerHTML="invalid username";
    			getLabel.style.color="red";
    			return false;
    		}
    	}
    	</script>
    
    	<title>untitled document</title>
    
    </head>
    
    <body>
    
    <p>Enter your username below. It must be at least 5 characters.</p>
    
    <form>
    	<input id="username" onkeyup="return validate()" type="text"/>
    	<input type="submit" value="submit"/>
    	<br/>
    	<label id="labelUser" for="username"></label>
    </form>
    
    </body>
    </html>
    Notice onkeyup. This gives the user continual feedback until they hit your "magic number" of 5 characters. When they hit that they can continue or stop.

  3. #3
    Join Date
    Oct 2013
    Posts
    484
    A quick PS to the above code. You don't need the "return false;" lines. Forgot to delete them...

  4. #4
    Join Date
    Oct 2013
    Posts
    484
    On third thought, use this code instead, it revalidates the username on submit so a 3 character username can't get through.
    Code:
    <!DOCTYPE html>
    <html lang="en">
    <head>
    
    	<meta charset="utf-8">
    
    	<script>
    	function validate(){
    		var getUser=document.getElementById("username");
    		var getLabel=document.getElementById("labelUser");
    		if(getUser.value.length>=5){
    			getLabel.innerHTML="Valid username";
    			getLabel.style.color="green";
    			return true;
    		}
    		else{
    			getLabel.innerHTML="invalid username";
    			getLabel.style.color="red";
    			return false;
    		}
    	}
    	</script>
    
    	<title>untitled document</title>
    
    </head>
    
    <body>
    
    <p>Enter your username below. It must be at least 5 characters.</p>
    
    <form onsubmit="return validate()">
    	<input id="username" onkeyup="return validate()" type="text"/>
    	<input type="submit" value="submit"/>
    	<br/>
    	<label id="labelUser" for="username"></label>
    </form>
    
    </body>
    </html>

  5. #5
    Join Date
    Mar 2007
    Location
    localhost
    Posts
    2,348
    First and most important thing is that JavaScript should never be used or relied upon for security or securing log-in details, the server should be the point at which any security checking is performed.

    Javascript is best used to limit the type of entry in the fields, the main reason is a user can simply turn off javascript and any code you would rely on to secure your page is instantly undone and you then expose your server to a security risk.
    Yes, I know I'm about as subtle as being hit by a bus..(\\.\ Aug08)
    Yep... I say it like I see it, even if it is like a baseball bat in the nutz... (\\.\ Aug08)
    I want to leave this world the same way I came into it, Screaming, Incontinent & No memory!
    I laughed that hard I burst my colostomy bag... (\\.\ May03)
    Life for some is like a car accident... Mine is like a motorway pile up...

    Problems with Vista? :: Getting Cryptic wid it. :: The 'C' word! :: Whois?

  6. #6
    Join Date
    Nov 2013
    Posts
    1
    Great post. All posts have something to learn. Your work is very good and i appreciate you and hopping for some more informative posts.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles