www.webdeveloper.com
Results 1 to 4 of 4

Thread: Validate empty fields

  1. #1
    Join Date
    Apr 2013
    Posts
    2

    Validate empty fields

    I am trying to lear javaScript so I am a beginner. Know I am trying to validate empty field, if the user don't enter and email it shows a validation message, if the user don't enter a password it shows a validation message, and the same for both. I tried to do something but it doesn't work. I still don't get that much how the can I call the input fields to java script. If someone can help me


    Code:
    <html>
    <title>  Practice  </title>
    <head>
    <script> 
    
     function practice()
    {
    	if(document.test.firstname.value=="")
    	{
    		
    		alert ("Both field must be field, please provide your email");
    		document.test.firstname.focus();
    		resturn false;
    		
    	}
    	else (document.test.pwd.value=="")
    	{
    		alert("Both field must be field, please provide your password"
    		document.test.pwd.focus();
    		return false;
    
    
    	}
    	else (document.test.firstname.value=="" || document.test.pwd.value=="")
    	{
    		alert ("Both field must be field");
    		document.test.firstname.focus();
    		resturn false;
    	}
    		return(true);
    }
    
    
    
    </script>
    </head>
    <body>
    <form name="test" onSubmit="practice()">
    
     First Name: <input type="text" name="firstname"> <br>
     Password: <input type="password" name="pwd" >
    	<input type="submit" value="Submit" 
    </form>
    </body>
    
    
    </html>

  2. #2
    Join Date
    Apr 2013
    Posts
    1

    Thumbs up To select a HTML element

    Hi Shinju,

    You can select the HTML elements by the name, id and by tag, you can try use any of these methods.
    eg: document.getElementById("youe elementId").value!="" (or)
    document.getElementByName("yourelementName")[0].value!=""

    var email=document.getElementByName("email")[0].value;
    var pwd=document.getElementByName("password")[0].value;

    function check_mandatory()
    {
    if(email=="" || pwd=="")
    {
    alert('Email/password field cant left empty!')
    return false;
    }
    }

    Make a try.

  3. #3
    Join Date
    Jan 2010
    Posts
    79
    Hi bud

    There is a problem with your if else statement, primarily you can have only one “else” and has no conditional statement, that said you can use an “else if” which will take a conditional statement, I suggest that you google “javascript if else” there are plenty of tutorials that can cover the subject far better than I can in this post

    You also had a few syntax errors like missing brackets and misspelled words “resturn” rather than “return” and logical “or” rather than logical “and”

    There is also a little issue with the flow of your function if the user didn’t fill in both fields then in your function the first conditional statement would be true and return false and you never get to the third conditional statement where you did your check for both fields, the solution would be to move it to the first conditional statement.

    Here is a working version of your code:
    Code:
    <html>
      <head>
        <script type="text/javascript">
     function practice()
    {
    	if (document.test.firstname.value=="" && document.test.pwd.value=="")
    	{
    		alert ("Both field must be field");
    		document.test.firstname.focus();
    		return false;
    	}
    	else if(document.test.firstname.value=="")
    	{
    		alert ("Both field must be field, please provide your name");
    		document.test.firstname.focus();
    		return false;
    	}
    	else if (document.test.pwd.value=="")
    	{
    		alert("Both field must be field, please provide your password");
    		document.test.pwd.focus();
    		return false;
    	}
    
    	else
    	{
    		return true;
    	}
    }
        </script>
      </head>
      <body>
       <form name="test" onSubmit="return practice()">
         First Name: <input type="text" name="firstname"> <br>
         Password: <input type="password" name="pwd" >
         <input type="submit" value="Submit" 
        </form>
    
      </body>
    </html>

  4. #4
    Join Date
    Dec 2005
    Location
    FL
    Posts
    7,380

    Lightbulb

    Keep in mind that a space (' ') entry in any of your fields will pass the validation of entry == ""
    Probably not what you want: a firstname of ' ' with password of ' '

    One easy change might be to substitute any space found in the entry fields with a "" and then test to see if it still ""
    Something like this ...
    Code:
    function practice() {
      var fname = document.test.firstname.value.replace(/\s/g,'');
      var passwd = document.test.pwd.value.replace(/\s/g,'');
      if (fname=="" && passwd=="") { // for testing purposes: alert('Entry Error') } else { alert('Entry OK'); }
    // ... etc. ...
    You might want to look at some of the validation suggestions posted with a search of this forum.

Thread Information

Users Browsing this Thread

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

Tags for this Thread

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