How to generate alert when clicking Submit button, only when the html form is full using Javascript : <p>I have this html form with many forms of elements. I need to generate the alert "Thank you for your time! Your details have been submitted!" once the submit button is clicked, only when the form is full. When the form is empty I do not want to see this message. So far I've been using onClick event. Can someone please help me on this (I'm trying to implement this using Javascript)</p>

<p>Here's the Javascript code and HTML body</p>

<pre><code>&lt;html&gt;

&lt;head&gt;

&lt;title&gt;JS Validation for other types of form input fields&lt;/title&gt;

&lt;script type="text/javascript"&gt;

  function submitClick( ) //function shows message after submitting information

  {

  alert("Thank you for your time! Your details have been submitted!");

  }


  function formValidation ( )

  {

  flag = true;

  if (document.myForm.user_name.value == "" )

  {

  alert ( "Please fill in your Name!" );

  flag = false;

  }

  // Validate letters only as Name
  if (!/^[a-zA-Z]*$/g.test(document.myForm.user_name.value))

  {

  alert("Enter alphabetic characters as Name!");

  flag = false;

  }

  // Validate emails
 if (!/^\w+([\.-]?\w+)*@\w+([\.-]?\w+)* (\.\w{2,3})+$/.test(myForm.user_email.value))  //Regular expressions to validate email

 {

 alert("Enter Valid Email Address!");

 flag = false;

 }

 // Validate Phone number

 flag = true;

 if (document.myForm.user_phone.value == "" )

 {

 alert ( "Please fill in your Phone Number!" );

 flag = false;

 }


 if (!/^[0-9]*$/g.test(myForm.user_phone.value))

 {

 alert("Enter numeric values as Phone Number!");

 flag = false;

 }


 if ((document.myForm.userGender[0].checked == false) &amp;&amp;  (document.myForm.userGender[1].checked == false ) )

 {

 alert ( "Please select your gender!" );

 flag = false;

 }

 if (document.myForm.userAge.selectedIndex == 0 )

 {

 alert ( "Please select your Age from the drop-down list!" );

 flag=false;

 }

 if (document.myForm.termsAndConditions.checked == false )

 {

 alert ( "Please check the Terms and Conditions box!" );

 flag= false;

 }

 return flag;

 }

 &lt;/script&gt;

 &lt;/head&gt;

 &lt;body bgcolor = "#FFFFFF"&gt;

 &lt;form name="myForm" method="post" onSubmit=" return formValidation( );"&gt;

 &lt;h1&gt;Please fill out your details below:&lt;/h1&gt;

 &lt;p&gt;Name: &lt;input type="text" name="user_name"&gt;&lt;/p&gt;

 &lt;p&gt;Email: &lt;input type="text" name="user_email"&gt;&lt;/p&gt;

 &lt;p&gt;Phone: &lt;input type="text" name="user_phone"&gt;&lt;/p&gt;

 &lt;p&gt;Gender: &lt;input type="radio" name="userGender" value="Male"&gt;Male

 &amp;nbsp; &lt;input type="radio" name="userGender" value="Female"&gt;Female&lt;/p&gt;

 &lt;p&gt;Age:

 &lt;select name="userAge"&gt;

 &lt;option value=""&gt;Please select your age:&lt;/option&gt;

 &lt;option value="0-17 years"&gt;0-17 years&lt;/option&gt;

 &lt;option value="18-29 years"&gt;18-29 years&lt;/option&gt;

 &lt;option value="30-40 years"&gt;30-40 years&lt;/option&gt;

&lt;option value="40-64 years"&gt;40-64 years&lt;/option&gt;

&lt;option value="65+ years"&gt;65+ years&lt;/option&gt;

&lt;/select&gt;

&lt;p&gt;Please tick the checkbox if you agree with our Terms and Conditions:

&lt;input type="checkbox" name="termsAndConditions" value="Yes"&gt; Yes

&lt;p&gt;&lt;input type="submit" name="send" value="Submit Details" onClick="submitClick( )"&gt;&lt;/p&gt;

&lt;/form&gt;

&lt;/body&gt;

&lt;/html&gt;
</code></pre>
