What is the difference between using a text link with JavaScript to submit a form and using an input/submit or button in PHP?

When using a text link with JavaScript to submit a form, the form data is not automatically included in the request, so you need to manually gather and send the form data using JavaScript. On the other hand, using an input/submit or button in PHP automatically includes the form data in the request when the form is submitted. To solve this issue, you can use JavaScript to gather the form data and submit it along with the request when using a text link. 

<form id="myForm" action="submit.php" method="post">
  <input type="text" name="username">
  <input type="password" name="password">
</form>
<a href="#" onclick="submitForm()">Submit Form</a>

<script>
function submitForm() {
  var form = document.getElementById("myForm");
  var formData = new FormData(form);
  
  fetch(form.action, {
    method: form.method,
    body: formData
  }).then(response => {
    console.log('Form submitted successfully');
  }).catch(error => {
    console.error('Error submitting form');
  });
}
</script>

Keywords

text link JavaScript form submission input/submit button

Related Questions