详解flask表单提交的两种方式


Posted in Python onJuly 21, 2018

一.通用方式

通用方式就是使用ajax或者$.post来提交。

前端html

<form method="post" action="/mockservice" method = "post">
   ... 

  <div class="form-group">
    <label>data <font style="color:#a94442" size="2">
    <input class="form-control" id="data" name="data">
  </div>
  <div class="form-group">
    <button id="start" type="submit" class="btn btn-default">Submit  </button>
  </div>
</form>

将操作绑定

$(document).ready(function() {
  MockTask.start();
});

MockTask ={
  startId: "start_mock",
  start: function(){
    $('#'+this.startId).click(function (){



...var data = $('#data').val();

      var form_data = JSON.stringify({
       ..."data": data
      });
      MockSubmit.createTask(form_data);

    });
  },
};

MockSubmit = {
  createTask: function(data){
    var url = "/mockservice";
    $.post(url,data,function(result){
      if (result.code != 'SUCC'){
        alert("failed to create a new api.")
      } else {
        alert("succ");
      }
    });
  }
};

function isEmptyString(info) {
  if (info == null || info == undefined || info.length == 0){
    return true;
  }
  return false
}

这样通过js来实现提交表单的功能,然后flask后端

@app.route("/mockservice",methods=['GET','POST'])
def MockController():
  form = MockCreate()
  if request.method == 'POST':
    code = request.form['code']
    api = request.form['api']
  return ...

通用方式的好处就是在其他框架中也适用。而且也并不复杂。

二.比较正宗的flask方式

前端html:

<form method="post" action="/mockservice" method = "post">
   ...

  <div class="form-group">
    <label>data <font style="color:#a94442" size="2">
    <input class="form-control" id="data" name="data">
  </div>
  <div class="form-group">
    <button type="submit" class="btn btn-default">Submit  </button>
  </div>
</form>

前端这时候可以不用绑定操作了,但需要新建一个form对象,用这种方式的好处就是flask有很多内置的方式帮你校验你的提交,一个字:省事!

class MockCreate(Form):
  user_email = StringField("email address",[validators.Email()])
  api = StringField("api",[Required()])
  submit = SubmitField("Submit")
  code = IntegerField("code example: 200",[Required()])
  alias = StringField("alias for api")
  data = TextAreaField("json format",[Required()])

后端这时候就要变成:

@app.route("/mockservice",methods=['GET','POST'])
def MockController():
  form = MockCreate()
  code = form['code']
  api = form['api']
  return render_template("testf.html",api=api,data=code)

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Python 相关文章推荐
python遍历 truple list dictionary的几种方法总结
Sep 11 Python
Python subprocess模块功能与常见用法实例详解
Jun 28 Python
python实现AES和RSA加解密的方法
Mar 28 Python
实例详解Python模块decimal
Jun 26 Python
Django中多种重定向方法使用详解
Jul 17 Python
Django 自定义权限管理系统详解(通过中间件认证)
Mar 11 Python
Python基于类路径字符串获取静态属性
Mar 12 Python
pyMySQL SQL语句传参问题,单个参数或多个参数说明
Jun 06 Python
Python判断字符串是否为合法标示符操作
Sep 03 Python
Python+OpenCV检测灯光亮点的实现方法
Nov 02 Python
windows+vscode安装paddleOCR运行环境的步骤
Nov 11 Python
Python 线程池模块之多线程操作代码
May 20 Python
python实现周期方波信号频谱图
Jul 21 #Python
Flask-Mail用法实例分析
Jul 21 #Python
python实现傅里叶级数展开的实现
Jul 21 #Python
Python实现快速傅里叶变换的方法(FFT)
Jul 21 #Python
Python实现获取本地及远程图片大小的方法示例
Jul 21 #Python
opencv python 傅里叶变换的使用
Jul 21 #Python
Numpy中的mask的使用
Jul 21 #Python
You might like
PHP函数strip_tags的一个bug浅析
2014/05/22 PHP
PHP中常用的字符串格式化函数总结
2014/11/19 PHP
基于递归实现的php树形菜单代码
2014/11/19 PHP
php中array_multisort对多维数组排序的方法
2020/06/21 PHP
PHP文件上传处理案例分析
2016/10/15 PHP
如何通过View::first使用Laravel Blade的动态模板详解
2017/09/21 PHP
php post json参数的传递和接收处理方法
2018/05/31 PHP
jQuery前台数据获取实现代码
2011/03/16 Javascript
jqPlot 图表中文API使用文档及源码和在线示例
2012/02/07 Javascript
通过JQuery实现win8一样酷炫的动态磁贴效果(示例代码)
2013/07/13 Javascript
jquery ajax的success回调函数中实现按钮置灰倒计时
2013/11/19 Javascript
Egret引擎开发指南之视觉编程
2014/09/03 Javascript
JavaScript 学习笔记之操作符(续)
2015/01/14 Javascript
Bootstrap实现渐变顶部固定自适应导航栏
2020/08/27 Javascript
Bootstrap模态框插件使用详解
2017/05/11 Javascript
ionic环境配置及问题详解
2017/06/27 Javascript
Vue的百度地图插件尝试使用
2017/09/06 Javascript
利用js给datalist或select动态添加option选项的方法
2018/01/25 Javascript
webpack项目调试以及独立打包配置文件的方法
2018/02/28 Javascript
Vue渲染过程浅析
2019/03/14 Javascript
vue数据初始化initState的实例详解
2019/04/11 Javascript
Vue拖拽组件列表实现动态页面配置功能
2019/06/17 Javascript
elementui实现预览图片组件二次封装
2020/12/29 Javascript
[02:41]DOTA2英雄基础教程 冥魂大帝
2014/01/16 DOTA
python妙用之编码的转换详解
2017/04/21 Python
Python生成rsa密钥对操作示例
2019/04/26 Python
Python 日志logging模块用法简单示例
2019/10/18 Python
python logging设置level失败的解决方法
2020/02/19 Python
matplotlib绘制鼠标的十字光标的实现(自定义方式,官方实例)
2021/01/10 Python
使用CSS3制作版头动画效果
2020/12/24 HTML / CSS
Nanushka官网:匈牙利服装品牌
2019/08/14 全球购物
日本最大化妆品和美容产品的综合口碑网站:cosme shopping
2019/08/28 全球购物
美国工业用品采购网站:Zoro.com
2020/10/27 全球购物
爱情保证书范文
2014/02/01 职场文书
2015年高中生国庆节演讲稿
2015/07/30 职场文书
CSS3新特性详解(五):多列columns column-count和flex布局
2021/04/30 HTML / CSS