防止从DOM表单提交刷新

Question

I was wondering if it was possible to prevent the page from refreshing on submission with the code I have below:

var new_element         = document.createElement('input');
new_element.type        = 'hidden';
new_element.name        = 'save';
new_element.value       = '';

var form_element = document.getElementById('document_form');    

form_element.appendChild(new_element);

form_element.submit();  

Answer 1

The form submit action is a navigation event, if you don't want a page reload you have to not use the submit action. Then you need to projcet another type of strategy, for example using ajax to send a request and obtain a response.

this is a jquery example:

$.post( "ajax/test.html", function( data ) {
  //data contains the response
});

or using AngularJS as you wrote in your comment:

$http({
  method: 'POST',
  url: '/someUrl'
}).then(function successCallback(response) {
    // this callback will be called asynchronously
    // when the response is available
  }, function errorCallback(response) {
    // called asynchronously if an error occurs
    // or server returns response with an error status.
  });

here details about agularjs $http object https://docs.angularjs.org/api/ng/service/$http