Prevent Form Submit

by keif

HTML

<form id="myform">
  Name:
  <input id="name" type="text" value="onur" />
  <br /> Email:
  <input id="email" type="text" value="[email protected]" />
  <br />
  <br />
  <button type="submit">type=submit</button>
  <button type="button" onclick="form.submit()">form.submit()</button>
</form>

JavaScript

// on DOM ready...
var form = document.getElementById('myform');

function onSubmit(event) {
  if (event) {
    event.preventDefault();
  }
  // do AJAX stuff...
  console.log('submitted');
}
form.addEventListener('submit', onSubmit, false);
form.submit = onSubmit;
console.log(urlEncodeFormData(form));

function urlEncodeFormData(form) {
  var i, e, data = [];
  for (i = 0; i < form.elements.length; i++) {
    e = form.elements[i];
    if (e.type !== 'button' && e.type !== 'submit') {
      data.push(encodeURIComponent(e.id) + '=' + encodeURIComponent(e.value));
    }
  };
  return data.join('&');
}