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

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

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

ajax这边这么写

    function ajaxForm(){
varifyinput();
var form= new FormData(document.getElementById("test_form"));
$.ajax({
url:"{{ url_for('main.all_revenue') }}",
type:"post",
data:form,
dataType: 'json',
processData:false,
contentType:false,
success:function(data){
create_table(data.result);
},
error:function(e){
alert("没有取得数据");
}
})
}

就这样

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. Linux mysql 命令

    mysql 是 MySQL 服务的一个命令行工具,常见用法如下: [root@localhost ~]$ mysql -uroot -p' # 本地连接 MySQL 服务 [root@localhos ...

  2. cut的用法【转】

    cut是一个选取命令,就是将一段数据经过分析,取出我们想要的.一般来说,选取信息通常是针对“行”来进行分析的,并不是整篇信息分析的. (1)其语法格式为:cut  [-bn] [file] 或 cut ...

  3. cocos2d-x游戏引擎核心之十——网络通信

    一.建立基本的http通信并得到返回信息 1.创建cocos2dx工程 2.项目引用外部库 如果要使用cocos2dx的CCHttpClient来进行网络访问,则需要引入cocos2dx的相关库,详细 ...

  4. JS 获取中英字符串字节长度

    正则匹配中文字: 这里限定中文字的范围,一般的使用是没什么问题的.如果要求十分严格的话,那么就只能使用更加严谨的代码匹配了 1:/([^\u0000-\u00FF])/g 2:/[^\x00-\xff ...

  5. 谷歌Volley网络框架讲解——Network及其实现类

    我们看到Network接口只有一个实现类BasicNetwork,而HttpStack有两个实现类. BasicNetwork这个类是toolbox工具箱包里的,实现了Network接口. 先来看下N ...

  6. 【PHP】 判断是否微信内置浏览器

    PHP 判断是手机端还是PC端 function isMobile() { // 如果有HTTP_X_WAP_PROFILE则一定是移动设备 if (isset($_SERVER['HTTP_X_WA ...

  7. JS-利用ajax获取json数据,并传入页面生成动态tab

    封装好的:ajax.js function ajax(url, fnSucc,fnFaild){ //1[创建] if(window.XMLHttpRequest){ var oAjax = new ...

  8. Eclipse failed to get the required ADT version number from the sdk

    failed to get the required ADT version number from the sdk 解决方法: eclipse 和 android studio 工具不能同时共用同一 ...

  9. Redis高级进阶

    目录 本章目标 Redis配置文件 Redis存储 Redis事务 Redis发布订阅 Redis安全 本章目标 Redis配置文件 Redis的存储 Redis的事务 Redis发布订阅 Redis ...

  10. 170720、springboot编程之properties文件讲解

    但是在实际开发过程中有更复杂的需求,我们在对properties进一步的升华.在本篇博客中您将会学到如下知识(这节中有对之前的知识的温故,对之前的升华): (1) 在application.prope ...