我正在開發小型 Flask 應用程式，該應用程式將需要一些資料來形成，并在完成后將其列印出來。提交表單后，它應該重定向到不同的站點（端點），但這并沒有發生。我用過return redirect(url_for('<name>')) and return render_template('<name>.html')。
form.html如果用戶需要它，我使用腳本動態創建新檔案，并且在該腳本中發生提交操作。
代碼：
from flask import Flask, session, render_template, request, redirect, url_for
from os import urandom
app = Flask(__name__)
app.secret_key = urandom(24)
@app.route('/login', methods=['GET', 'POST'])
def login():
if request.method == 'POST':
session['username'] = request.form['username']
return redirect(url_for('index'))
return render_template('login.html')
@app.route('/logout')
def logout():
session.clear()
return redirect(url_for('index'))
@app.route('/')
def index():
login = False
if 'username' in session:
login = True
return render_template('login_home.html', login=login)
@app.route('/form')
def form():
if 'username' in session:
return render_template('form.html')
return redirect(url_for('index'))
@app.route("/getform", methods=["POST", "GET"])
def getform():
if request.method == 'POST':
name = request.form.get('name')
email = request.form.get('email')
phone = request.form.get('phone')
address = request.form.get('address')
names = request.form.getlist('name[]')
emails = request.form.getlist('email[]')
print(name, email, phone, address, names, emails)
return redirect(url_for('index'))
if __name__ == '__main__':
app.run(debug=True)
這是form.html檔案：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Formular</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
</head>
<body>
<script>
$(document).ready(function() {
var MaxInputs = 10; //maximum input boxes allowed
var InputsWrapper = $("#InputsWrapper"); //Input boxes wrapper ID
var AddButton = $("#AddMoreFileBox"); //Add button ID
var x = InputsWrapper.length; //initlal text box count
var FieldCount=1; //to keep track of text box added
$(AddButton).click(function (e) //on add input button click
{
if(x <= MaxInputs) //max input box allowed
{
FieldCount ; //text box added increment
//add input box
$(InputsWrapper).append('<div ><p ><input type="text" placeholder="Unesite ime i prezime zaposlenika" name="name[]" id="field_' FieldCount '"/><input type="email" placeholder="Unesite email zaposlenika" name="email[]" id="field_' FieldCount '"/></p><a href="#" >×</a></div>');
x ; //text box increment
}
return false;
});
$("body").on("click",".removeclass", function(e){ //user click on remove text
if( x > 1 ) {
$(this).parent('div').remove(); //remove text box
x--; //decrement textbox
}
return false;
})
$('#submit').click(function(){
$.ajax({
url:"/getform",
method:"POST",
data:$('#add_skills').serialize()
});
});
});
</script>
<style>
.row {padding:10px;}
</style>
<div class="container"><br/> <br/>
<h2 align="center">Form</h2><div id="resultbox"></div>
<div class="form-group">
<form name="add_skills" id="add_skills">
<div class="form-group">
<input type="text" class="form-control" id="Name" aria-describedby="emailHelp"
placeholder="name" name="name" value="{{ name }}" required>
</div>
<div class="form-group">
<input type="text" class="form-control" id="address" aria-describedby="emailHelp"
placeholder="address" name="address" value="{{ address }}" required>
</div>
<div class="form-group">
<input type="text" class="form-control" id="phone" aria-describedby="emailHelp"
placeholder="phone" name="phone" value="{{ phone }}" required>
</div>
<div class="form-group">
<input type="email" class="form-control" id="email" aria-describedby="emailHelp"
placeholder="email" name="email" value="{{ email }}" required>
</div>
<label>Additional info:</label>
<div id="InputsWrapper">
<div class="row">
<div class="col-xs-6"><input type="text" name="name[]" placeholder="name" class="form-control name_list" />
<input type="email" name="email[]" placeholder="email" class="form-control name_list" /></div>
<div class="col-xs-6"><button type="button" name="add" id="AddMoreFileBox" class="btn btn-success">Add</button></div>
</div>
</div>
<br/>
<input type="button" name="submit" id="submit" class="btn btn-info" value="Submit" />
</form>
</div>
</div>
</body>
</html>
我不會發布login.html，login_home.html因為它與這個問題無關。
uj5u.com熱心網友回復：
問題已解決：問題出現在form.html：
我洗掉了：
$('#submit').click(function(){
$.ajax({
url:"/getform",
method:"POST",
data:$('#add_skills').serialize()
});
});
添加method="POST"和action="/form"標記<form>：
<form name="add_skills" id="add_skills" action="/form" method="POST">
替換：
<input type="button" name="submit" id="submit" class="btn btn-info" value="Submit" />
和：
<button type="submit" class="btn btn-secondary">Submit</button>
在main.py添加了名稱的新端點中form：
@app.route('/form', methods=["POST"])
def form():
name = request.form.get("name")
address = request.form.get("address")
telephone = request.form.get("phone")
email = request.form.get("email")
print(name, address, telephone, email)
return render_template("login_home.html")
所以這解決了我的問題:)
我希望這會幫助與我有類似問題的人。
轉載請註明出處，本文鏈接：https://www.uj5u.com/gongcheng/435984.html
標籤：javascript Python html 阿贾克斯 烧瓶