Home >Web Front-end >JS Tutorial >How to prevent refresh after Ajax submits form page

How to prevent refresh after Ajax submits form page

php中世界最好的语言
php中世界最好的语言Original
2018-04-02 17:24:323154browse

This time I will bring you a method to prevent refreshing after Ajax submits the form page. What are the precautions to prevent refreshing after Ajax submits the form page? The following is a practical case, let's take a look.

Note: When using ajax to submit a form, it is best not to use submit but to use button instead.

<form>
   <p class="col-md-9 col-sm-9 col-xs-12 col-md-offset-3">
             <input type="button" class="btn btn-info" value="重置" onclick="return resetaa()">
             <input type="button" class="btn btn-success" value="提交" onclick="return formCheck()">
</form>
 <script type="text/JavaScript">
   function formCheck(){
    $.ajax({
       type: "post",
       url:'/fudaMes/orderInfo/insertOrderInfo',
       data:$('#formId').serialize(),// 你的formid
       async: true,
       error: function(request) {
       new PNotify({
           title: '提交失败',
           text: '信息录入失败',
           type: 'error',
           styling: 'bootstrap3'
         });
       },
       success: function(data) {
      if(data=="success"){
          new PNotify({
             title: '提交成功',
             text: '订单信息已录入',
             type: 'success',
             styling: 'bootstrap3'
           });  
       }else{
      new PNotify({
             title: '提交失败',
             text: '信息录入失败',
             type: 'error',
             styling: 'bootstrap3'
           });
      } 
       }
     });
   }
</script>
I believe you have mastered the method after reading the case in this article. Please come for more exciting information. Pay attention to other related articles on php Chinese website!

Recommended reading:

Asynchronous file or picture upload ajax

AJAX implementation without refreshing login

The above is the detailed content of How to prevent refresh after Ajax submits form page. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn