title: How to configure the submit button so that it can submit the form that has been validated?
body: <p>I'm having a problem where Once I put "return validation()" in my submit button, The button won't submit. But the validation is working fine. Is there anyway to bypass this so that javascript can validate my file and then submit the form?</p>
  
  <p>This is my javascript:</p>
  
  <pre><code>function validate()
  {
  
      var username = document.getElementById("name");
      var img = document.getElementById("image");
  
  
      if(username.value.trim()=="")
      {
          var myDiv = document.getElementById("error");
          myDiv.innerHTML = "Username Not Entered";
      }
  
      else if (img.value.trim()=="")
  
      {
          var myDiv = document.getElementById("error");
          myDiv.innerHTML = "Please Select an image";
      }
  
      return false;
  
  
  }
  
  
  &lt;/script&gt;
  </code></pre>
  
  <p>And this is my html, When I put return in front of 
  
  <pre><code>        &lt;div class="add-form"&gt;
              &lt;h1 class="text-center"&gt;&lt;font face="fantasy"&gt;Please Insert new image&lt;/font&gt;&lt;/h1&gt;
              &lt;form onSubmit = "validate()" method="post" enctype="multipart/form-data" id="FormID"&gt;
                  &lt;label&gt;User Name&lt;/label&gt;
                  &lt;input id = "name" type="text" name="user_name" class="form-control"&gt;
                  &lt;label&gt;Select image to upload&lt;/label&gt;
                  &lt;input id = "image" type="file"  onchange ="unlock()" name="profile" class="form-control2" accept="*/image"&gt;
                  &lt;button type="submit" value = "submit" name="btn-add"&gt;upload&lt;/button&gt;
                  &lt;div id = "error"&gt;Please fill up the username and select and image&lt;/div&gt;
  
              &lt;/form&gt;
          &lt;/div&gt;
          &lt;hr style="border-bottom: 5px blue solid;"&gt;
      &lt;/div&gt; 
  &lt;!-- end form insert --&gt;
  &lt;!-- view form --&gt;
  &lt;div class="container"&gt;
      &lt;div class="view-form"&gt;
          &lt;div class="row"&gt;
          &lt;?php 
              $stmt=$db_conn-&gt;prepare('SELECT * FROM tbl_user ORDER BY id DESC');
                  $stmt-&gt;execute();
                  if($stmt-&gt;rowCount()&gt;0)
                  {
                      while($row=$stmt-&gt;fetch(PDO::FETCH_ASSOC))
                      {
                          extract($row);
                          ?&gt;
  
              &lt;div class="col-sm-3"&gt;
              &lt;img src="uploads/&lt;?php echo $row['picprofile']?&gt;"&gt;&lt;br&gt;&lt;br&gt;
              &lt;a class="btn btn-info" href="edit_form.php?edit_id=&lt;?php echo $row['id']?&gt;" title="click for edit" onlick="return confirm('Sure to edit this record')"&gt;&lt;span class="glyphicon glyphicone-edit"&gt;&lt;/span&gt;Edit&lt;/a&gt;
              &lt;a class="btn btn-danger" href="?delete_id=&lt;?php echo $row['id']?&gt;" title="click for delete"&gt;Delete&lt;/a&gt;
  
              &lt;/div&gt;
  
              &lt;?php 
  
                  }
              }
              ?&gt;
          &lt;/div&gt;
  
      &lt;/div&gt;
  &lt;/div&gt;
  &lt;!-- end view form --&gt;
  &lt;script type="text/javascript" src="js/bootstrap.min.js"&gt;&lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>