#1
  1. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Apr 2013
    Posts
    40
    Rep Power
    2

    Validate form info using JS


    Good day,

    How would one validate form entries such as pictures and text?

    If the text is empty or invalid then how do I generate a text box or warning that tells users users to fill the forms in properly.

    Any advice would help.
  2. #2
  3. A Not To Shabby Code Smurf
    Devshed Beginner (1000 - 1499 posts)

    Join Date
    Aug 2008
    Posts
    1,129
    Rep Power
    119
    Do an online search for "javascript form validation" and you should see several examples, on how to do this.
  4. #3
  5. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Apr 2013
    Posts
    40
    Rep Power
    2

    Re:


    Thanks. I can submit an error message for one field.

    But how do I put all the fields into the one function?

    For example:
    title, price, description, etc

    Here is my code

    Code:
    <script>
    function validateForm()
    {
    var x=document.forms["myForm"]["title"].value;
    if (x===null || x==="")
      {
      alert("First name must be filled out");
      return false;
      }
    }
    </script>
    <form enctype="multipart/form-data" method="POST" action="ads.php"  />
    Title:<input type="text" name ="title" size="70" /><br />
    Price(CAN): <input type="text" name ="price" size="4" /> 
    Location: <input type="text" name ="location" size="20" /><br />
    Description: <br /><textarea cols="62" rows="5" name="description">
    </textarea><br />
    Submit Picture:<input type="file" name="pix" />
  6. #4
  7. A Not To Shabby Code Smurf
    Devshed Beginner (1000 - 1499 posts)

    Join Date
    Aug 2008
    Posts
    1,129
    Rep Power
    119
    You do it the same way you did the title value. You just create new variables (like your "x" variable) for each of your input field values and add an if/else condition for each of those variables (one below the other).
  8. #5
  9. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Apr 2013
    Posts
    40
    Rep Power
    2

    Re:


    Something like this?

    Code:
    function validateForm()
    {
    var x=document.forms["myForm"]["title"].value;
    var y=document.form["myForm"]["price"].value;
    var z=document.form["myForm"]["location"].value;
    var a=document.form["myForm"]["description"].value;
    if (x===null || x==="")
      {
      alert("TITLE must be filled out");
      }
     
     else if (y===null || y==="");
      {
      alert("PRICE must be filled out");
      }
    
     else if (z===null || z==="")
      {
      alert("LOCATION name must be filled out");
      }
      
     else if (a===null || a==="")
      {
      alert("DESCRIPTION must be filled out");
      }
    }
    </script>
  10. #6
  11. A Not To Shabby Code Smurf
    Devshed Beginner (1000 - 1499 posts)

    Join Date
    Aug 2008
    Posts
    1,129
    Rep Power
    119
    Yes - You might want to keep your "return false" in each of your conditions, as well.
  12. #7
  13. No Profile Picture
    Contributing User
    Devshed Frequenter (2500 - 2999 posts)

    Join Date
    Dec 2004
    Posts
    2,971
    Rep Power
    375
    although doing it like that is extremely TEDIOUS and you have to copy and paste this to other forms and change the variables..

    why not create a generic script,

    // loop through all the input/select etc

    //if empty append to an error ARRAY

    //print out that error array

    to make it a bit more complicated, have "attributes/class" called "required, string, integer, email, etc" and then do an if after your loop:

    //if attr == string and not_matches a string
    // append to array

    and so on..

    if you manage to do it PROPERLY once then you can host it on one location and link to it from all the forms..

    Comments on this post

    • web_loone08 disagrees : The OP seems fairly new to JavaScript. Do you really think (at this point) the OP is capable of doing all of that, because I don't and that's why I did not advise that. That's a little more advanced, then the OP is ready for, at this juncture.
  14. #8
  15. No Profile Picture
    Contributing User
    Devshed Frequenter (2500 - 2999 posts)

    Join Date
    Dec 2004
    Posts
    2,971
    Rep Power
    375
    there is NO reason why he shouldnt be able to do that. it is called self improvement. instead of creating that code multiple times.. if he creates one code (use the forum for help if need be) it may take long, but it will save him LOTS of time.
  16. #9
  17. A Not To Shabby Code Smurf
    Devshed Beginner (1000 - 1499 posts)

    Join Date
    Aug 2008
    Posts
    1,129
    Rep Power
    119
    Originally Posted by paulh1983
    it may take long, but it will save him LOTS of time.
    Is that a contradiction or is that not basically what I was saying... lol. New equals "learn the basics, then go from there"... otherwise, lots of time lost in more complex code, then the OP is ready for... just saying.
    Originally Posted by paulh1983
    there is NO reason why he shouldnt be able to do that. it is called self improvement. instead of creating that code multiple times.. if he creates one code (use the forum for help if need be)
    Baby steps... that's all I am saying, then evolve... and yes, you are correct.
  18. #10
  19. No Profile Picture
    Contributing User
    Devshed Frequenter (2500 - 2999 posts)

    Join Date
    Dec 2004
    Posts
    2,971
    Rep Power
    375
    Originally Posted by web_loone08
    Is that a contradiction or is that not basically what I was saying... lol. New equals "learn the basics, then go from there"... otherwise, lots of time lost in more complex code, then the OP is ready for... just saying.Baby steps... that's all I am saying, then evolve... and yes, you are correct.
    No what you are saying is that he can use this script which means he will have multiple copies so when he learns the new way, he might have to go through all of his previous scripts.

    when i say it may take long but save him time, i mean he would be able to reuse this in future projects.. i.e. long term it will save him time.

    Comments on this post

    • web_loone08 agrees : I agree... if the OP feels confident enough to pursue this; then I say he should go for it. If not, then he can stick with the individual if/else condition(s).

IMN logo majestic logo threadwatch logo seochat tools logo