背景:

  使用ajax提交form表单时,提交按钮的type值写为了submit,导致ajax中回调函数中的提示信息toastr.success('提交数据成功');没有执行,只执行了alert语句

,就算toastr提示语句在alert前面写着也不执行。

  

 function add_smoke() {
$.ajax({
//几个参数需要注意一下
cache:false,
type: "POST",//方法类型
dataType: "json",//预期服务器返回的数据类型
url: "/add_smoke/" ,//url
data: $('#add-smoke-form').serialize(),
async:false, //必须要为false,必须必须 success: function (data) {
console.log(data);//打印服务端返回的数据(调试用)
if(data.status == "success"){ {#关闭模态框并清除框内数据,否则下次打开还是上次的数据#}
document.getElementById("add-smoke-form").reset();
$('#myModal').modal('hide'); {# 判断确实正确入库之后提示#}
toastr.success('提交数据成功'); {#刷新表格数据#}
$("#mytab").bootstrapTable('refresh'); }
},
error : function() {
toastr.warning("请输入所有数据");
}
});
}

原因:

  当使用ajax提交数据时,提交按钮的type必须是button,要保证ajax执行成功后可以顺序执行success方法体中的所有程序,则HTML中的submit按钮必须不能是submit类型,最好是写成type=”button”,因为默认情况下,即使你写了ajax提交的程序,但如果该按钮类型是submit时,当你点击了它,它既会执行ajax方法,也会执行浏览器默认的提交方法,导致的结果就是ajax还没执行结束,页面便刷新了一次,导致ajax中的方法没有完全执行。

 

ajax页面刷新小错误(提交按钮type必须为button,而不能是submit)的更多相关文章

  1. DWZ框架Ajax无刷新表单提交处理流程

    DWZ框架Ajax无刷新表单提交处理流程是: 1.       ajax表单提交给服务器 2.       服务器返回一个固定格式json结构 3.       js会调函数根据这个json数据做相应 ...

  2. PHP防止页面刷新、重复提交数据

    PHP防止页面刷新.重复提交数据 (2011-12-09 16:52:45) 转载▼ 标签: it 分类: php技术相关 闲来无事看了一下php session ,又在网上看了防止页面刷新重复提交数 ...

  3. django中form页面刷新后自动提交的解决方案

    如果一个页面包含了form,同时这个form中的提交按钮是type=submit的input的时候,你刷新该页面,就会有弹窗提示是否重新提交表单,这个特性不胜其烦,常见解决方法有两个: 第一种是前端的 ...

  4. MVC页面上多个提交按钮提交到不同的Action

    使用mvc扩展类,ActionNameAttribute方法如下: [AttributeUsage(AttributeTargets.Method, AllowMultiple = false, In ...

  5. 使用Ajax错误的全页面刷新问题

    给提交按钮写了ajax请求,结果每次提交就将全业务刷新了.一大番折腾才知道是 提交按钮标签使用不当导致.   button 标签请添加 type='button' 属性,因为浏览器默认会认为 butt ...

  6. jquery 的ajax无刷新上传文件之后,页面还是会莫名的刷新-----解决办法

    文件上传用到全局数组: $_FILES 只需要把下面的 <button onclick="post()">提交</button> 改为 <input ...

  7. jsp登录页面,展示错误信息,刷新页面后错误依然存在解决方案

    在做登录页面的时候,通常使用form表单同步提交的方法进行提交的,也就是在form表单里去写action,如果登录失败,jsp通过jstl表达式获取错误信息展示在页面上,但是有一个问题就是,即使你刷新 ...

  8. Ajax无刷新提交表单和显示

    ajax无刷新表单提交:   <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "htt ...

  9. JavaScript + PHP 实现刷新继续保持倒计时的按钮

    场景:发送一个验证码到手机,当验证码发出时,会提示隔 1 分钟之后可以再次发送.通常有这几种方式防止恶意请求,一是再次发送之前需要输入验证码,二是在指定的时间间隔之内不能再次发送. 有些网站在 1 分 ...

随机推荐

  1. piplinedb 团队加入confluen

    这个消息对于使用pipelinedb 的人来说,可能有点不好,因为官方已经明确说明了,pipelinedb 截止到1.0 版本,将不再维护了, 基本就要靠社区了,但是pipelinedb 团队还是比较 ...

  2. RookeyFrame 附件 上传附件

    上传附件可允许的格式: 位置:Rookey.Frame.Web\Config\upload.xml 节点:Attachment -> allowType

  3. 洛谷 P1456Monkey King

    题目描述 要把打架的两堆猴子合并为一堆,查询的又是最大值,所以很容易想到可并堆. 题目要求打完架后战斗力最大的猴子的战斗力要减半,但不能直接在堆中进行这个操作,因为战斗力减半后这只猴子不一定是战斗力最 ...

  4. 洛谷P2312解方程题解

    题目 暴力能得\(30\),正解需要其他的算法操作,算法操作就是用秦九韶算法来优化. 秦九韶算法就是求多项式的值时,首先计算最内层括号内一次多项式的值,然后由内向外逐层计算一次多项式的值,然后就将求\ ...

  5. 数据结构实验之排序七:选课名单 (SDUT 3404)

    #include <stdio.h> #include <string.h> #include <stdlib.h> struct node { char data ...

  6. Maven 异常 druid jar冲突

    异常: 十二月 25, 2017 11:04:41 下午 org.apache.tomcat.util.digester.SetPropertiesRule begin 警告: [SetPropert ...

  7. Java Redis缓存穿透/缓存雪崩/缓存击穿,Redis分布式锁实现秒杀,限购等

    package com.example.redisdistlock.controller; import com.example.redisdistlock.util.RedisUtil; impor ...

  8. 【CSP模拟赛】避难向导(倍增lca&树的直径)

    耐力OIer,一天7篇博客 题目描述 “特大新闻,特大新闻!全国爆发了一种极其可怕的病毒,已经开始在各个城市 中传播开来!全国陷入了巨大的危机!大量居民陷入恐慌,想要逃到其它城市以 避难!经调查显示, ...

  9. SpringMVC返回一个JSON对象到界面

    首先明确,在JavaScript中并没有类型这一说,只有一个类型就是var.我们要做的就是让JavaScript得到我们返回的一个对象让它以某种方式去处理数据. 前端代码 后台代码 @RequestB ...

  10. python 椭球面

    作者:chaowei wu链接:https://www.zhihu.com/question/266366089/answer/307037017来源:知乎著作权归作者所有.商业转载请联系作者获得授权 ...