詳解flask表單提交的兩種方式
一.通用方式
通用方式就是使用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來實(shí)現(xiàn)提交表單的功能,然后flask后端
@app.route("/mockservice",methods=['GET','POST'])
def MockController():
form = MockCreate()
if request.method == 'POST':
code = request.form['code']
api = request.form['api']
return ...
通用方式的好處就是在其他框架中也適用。而且也并不復(fù)雜。
二.比較正宗的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>
前端這時(shí)候可以不用綁定操作了,但需要新建一個(gè)form對(duì)象,用這種方式的好處就是flask有很多內(nèi)置的方式幫你校驗(yàn)?zāi)愕奶峤唬粋€(gè)字:省事!
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()])
后端這時(shí)候就要變成:
@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)
以上就是本文的全部內(nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
- flask中主動(dòng)拋出異常及統(tǒng)一異常處理代碼示例
- Flask教程之重定向與錯(cuò)誤處理實(shí)例分析
- Flask web開發(fā)處理POST請(qǐng)求實(shí)現(xiàn)(登錄案例)
- Flask框架學(xué)習(xí)筆記之使用Flask實(shí)現(xiàn)表單開發(fā)詳解
- Flask框架學(xué)習(xí)筆記之表單基礎(chǔ)介紹與表單提交方式
- Python的Flask框架中web表單的教程
- 在Python的Flask中使用WTForms表單框架的基礎(chǔ)教程
- 在Python的Flask框架中構(gòu)建Web表單的教程
- Python Flask-web表單使用詳解
- flask入門之表單的實(shí)現(xiàn)
- Flask框架WTForm表單用法示例
- Flask框架學(xué)習(xí)筆記之消息提示與異常處理操作詳解
相關(guān)文章
Python3.6 Schedule模塊定時(shí)任務(wù)(實(shí)例講解)
下面小編就為大家?guī)硪黄狿ython3.6 Schedule模塊定時(shí)任務(wù)(實(shí)例講解)。小編覺得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-11-11
PyTorch中torch.nn.functional.cosine_similarity使用詳解
在pytorch中可以使用torch.cosine_similarity函數(shù)對(duì)兩個(gè)向量或者張量計(jì)算余弦相似度,這篇文章主要給大家介紹了關(guān)于PyTorch中torch.nn.functional.cosine_similarity使用的相關(guān)資料,需要的朋友可以參考下2022-03-03
Python數(shù)據(jù)分析之雙色球統(tǒng)計(jì)單個(gè)紅和藍(lán)球哪個(gè)比例高的方法
這篇文章主要介紹了Python數(shù)據(jù)分析之雙色球統(tǒng)計(jì)單個(gè)紅和藍(lán)球哪個(gè)比例高的方法,涉及Python數(shù)值運(yùn)算及圖形繪制相關(guān)操作技巧,需要的朋友可以參考下2018-02-02
OpenCV每日函數(shù)之BarcodeDetector類條碼檢測器
OpenCV在V4.5.3版本的contrib包中提供了一個(gè)barcode::BarcodeDetector類,用于條形碼的識(shí)別,這篇文章主要介紹了OpenCV每日函數(shù)?BarcodeDetector條碼檢測器,需要的朋友可以參考下2022-06-06
基于Python實(shí)現(xiàn)文件分類器的示例代碼
這篇文章主要為大家詳細(xì)介紹了如何基于Python實(shí)現(xiàn)文件分類器,目的主要是為了將辦公過程中產(chǎn)生的各種格式的文件完成整理,感興趣的可以了解一下2023-04-04
Python辦公自動(dòng)化之?dāng)?shù)據(jù)可視化與報(bào)表生成
在現(xiàn)代辦公環(huán)境中,數(shù)據(jù)處理和報(bào)表生成是一項(xiàng)重要的任務(wù),本文將高效介紹如何使用Python進(jìn)行數(shù)據(jù)可視化和報(bào)表生成,讓您的辦公工作更加順利2023-07-07
Python實(shí)現(xiàn)給PDF添加水印的方法
這篇文章主要介紹了Python實(shí)現(xiàn)給PDF添加水印的方法,文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2021-01-01
Python編程使用matplotlib挑鉆石seaborn畫圖入門教程
這篇文章主要為大家介紹了Python編程中使用matplotlib繪圖包來挑出完美的鉆石,本篇是seaborn包畫圖使用入門篇,有需要的朋友可以借鑒參考下2021-10-10

