Flask中使用ajax提交表单刷新数据,避免提交表单后使用return render_temp()会刷新页面

  1. <form id ="test_form">
  2. {{ form.hidden_tag() }}
  3. <div id="input-top">
  4. <div class="form-group">
  5. <label>开始日期</label>
  6. {{ form.begin_date }}
  7. <label>结束时间</label>
  8. {{ form.end_date }}
  9. </div>
  10. </div>
  11. <!--{{ form.submit(class = "querybtn",onclick="ajaxForm()") }}--><!--这里如果用这个会造成表单提交两次,而且第二次是get会刷新页面-->
  12. <button type="button" class = "querybtn" onclick="ajaxForm()">Click Me!</button>
  13. </form>

最下边加一个按钮,点击的时候调用js中ajax的函数

ajax这边这么写

  1. function ajaxForm(){
  2. varifyinput();
  3. var form= new FormData(document.getElementById("test_form"));
  4. $.ajax({
  5. url:"{{ url_for('main.all_revenue') }}",
  6. type:"post",
  7. data:form,
  8. dataType: 'json',
  9. processData:false,
  10. contentType:false,
  11. success:function(data){
  12. create_table(data.result);
  13. },
  14. error:function(e){
  15. alert("没有取得数据");
  16. }
  17. })
  18. }

就这样

flask使用ajax提交表单的更多相关文章

  1. Jquery ajax提交表单几种方法

    在jquery中ajax提交表单有post与get方式,在使用get方式时我们可以直接使用ajax 序列化表单$('#表单ID').serialize();就行了,下面我来介绍两个提交表单数据的方法. ...

  2. Validator验证Ajax提交表单的方法

    Validator验证Ajax提交表单的方法 转自:http://hunanpengdake.iteye.com/blog/1671360 当我们在一些稍微复杂的业务时,可能会遇到需要多个表单form ...

  3. lavarel框架中如何使用ajax提交表单

    开门见山,因为laravel以post形式提交数据时候需要加{{csrf_field()}}防止跨站攻击,所以当你用ajax提交表单时候自然也要加 在网上看了很多的解决方式,我是用下面这种方法解决的: ...

  4. Jquery ajax提交表单几种方法详解

    [导读] 在jquery中ajax提交表单有post与get方式,在使用get方式时我们可以直接使用ajax 序列化表单$( 表单ID) serialize();就行了,下面我来介绍两个提交表单数据的 ...

  5. ajax提交表单序列化(serialize())数据

    知识点: $("#form").serialize();将表单数据序列化为标准URL编码文本字符串(key1=value1&key2=value2…). 以下用一个例子来演 ...

  6. jquery实现ajax提交表单

    一般情况下,我们提交form表单采用的是submit的方法,典型的场景如下. <form id="thisForm" method="post" acti ...

  7. ajax提交表单、ajax实现文件上传

    ajax提交表单.ajax实现文件上传,有需要的朋友可以参考下. 方式一:利用from表单的targer属性 + 隐藏的iframe 达到类似效果, 支持提交含有文件和普通数据的复杂表单 方式二:使用 ...

  8. Ajax提交表单初接触

    <!doctype html> <html class="no-js"> <head> <meta charset="utf-8 ...

  9. KindEditor:Ajax提交表单时获取不到HTML内容

    当用Ajax提交表单时,KindEditor的内容获取不到,HTML数据获取不了 原因:当ajax提交时,KindEdito的HTML数据还没有同步到表单中来,那怎么去获取HTML数据呢? ----- ...

随机推荐

  1. ftp简单命令

    1.连接ftp ftp 192.168.10.15 进去后输入用户名 ,然后再输入密码,就这样登陆成功了,你会看到 ftp> 2.进入ftp后,你对目录需要切换操作.和linux一样的命令.cd ...

  2. 【RF库Collections测试】Dictionaries Should Be Equal

    Name:Dictionaries Should Be EqualSource:Collections <test library>Arguments:[ dict1 | dict2 | ...

  3. Python 列表表达式与生成器表达式

    列表表达式: (1) 语法1:[表达式 for 变量 in 列表],表示把得到的每一个变量值都放到 for 前面的表达式中计算 ,然后生成一个列表(2) 语法2:[表达式 for 变量 in 列表 i ...

  4. C语言100个经典的算法之兔子总数计算内含printf的用法

    语言的学习基础,100个经典的算法 C语言的学习要从基础开始,这里是100个经典的算法-1C语言的学习要从基础开始,这里是100个经典的算法 题目:古典问题:有一对兔子,从出生后第3个月起每个月都生一 ...

  5. Sublime Text 快捷键使用

    Sublime Text 2包含了大量快捷操作,而且还很方便修改和追加自己喜欢的快捷键.查看快捷键的方式也很简单:------------------------------------------- ...

  6. 解决Xcode "The selected destination does not support the architecture " 错误错误

    XCODE编译运行项目后,发现工程编译后无法运行,出现:"The selected destination does not support the architecture for whi ...

  7. 64位ubuntu下用code::blocks IDE配置opengl开发环境

    http://jingyan.baidu.com/article/c74d60007d104f0f6b595d6d.html 样例程序: #include <GL/glut.h> #inc ...

  8. Java三方---->excel框架之POI的使用一

    Apache POI是Apache软件基金会的开放源码函式库,POI提供API给Java程序对Microsoft Office格式档案读和写的功能.pdf框架之IText的使用,参见我的博客:Java ...

  9. PostgreSQL远程代码执行漏洞(CVE-2018-1058)学习笔记

    零.参考文献和绪论: 1.先知社区chybeta大神的--PostgreSQL 远程代码执行漏洞分析及利用—[CVE-2018-1058]--一文 2.博客园hunchill的--Mac 下 Post ...

  10. sort排序和uniq统计命令

    author:headsen chen date: 2018-08-13  11:08:09 1,sort:排序的功能,默认安装ASCII码来排序,-n 安装数值排,-r 按照倒序来排 [root@b ...