使用JS将用户输入从HTML传递到Flask
使用JS将用户输入从HTML传递到Flask
提问于 2021-07-29 08:26:35
我已经创建了一个JS，当单击一个按钮时创建2个用户输入字段，然后将显示在html页面上。我希望这2个输入一旦他们被创建到flask应用程序中就被传递。我把一切都安排得井井有条，但似乎什么都不管用。
我应该以另一种方式引用输入字段吗？我被困住了，如果能给我一些指导，我会非常感激的。
请找到我下面的代码
main.py
import sys
from flask import request, render_template, Flask, session, redirect, url_for
app = Flask(__name__)
app.config['SECRET_KEY'] = 'hjshjhdjah kjshkjdhjs'
@app.route('/', methods=['GET', 'POST'])
def inputNum():
if request.method == 'POST':
num1 = request.form.get("num0")
session["num1"] = num1
num2 = request.form.get("num1")
session["num2"] = num2
print(session["num1"])
return redirect(url_for("results"))
return render_template("inputNum.html")
@app.route('/results')
def results():
if "num1" and "num2" in session:
num1 = session["num1"]
num2 = session["num2"]
old_stdout = sys.stdout
log_file = open("message.log", "w")
sys.stdout = log_file
addNum(num1, num2)
sys.stdout = old_stdout
log_file.close()
with open("message.log", "r") as f:
content = f.read()
return app.response_class(content, mimetype='text/plain')
else:
return redirect(url_for('inputNum'))
def addNum(num1, num2):
num1 = int(num1)
num2 = int(num2)
sum = num1 + num2
print(sum)
if __name__ == '__main__':
app.run(debug=True)inputFields.js
var num = 2; // ads 2 fields at a time
var createInputs = function () {
$("#ip_div").append('<form id="form"></form>');
for (var i = 0; i < num; i++) {
$("#form").append("<input></input>");
}
};
$("#btn").click(function () {
createInputs();
//create unique ID for each input
$("#form")
.find("input")
.each(function (i) {
$(this).attr("type", "number");
$(this).attr("name", "num" + i);
$(this).attr("id", "num" + i);
$(this).attr("placeholder", "number" + i);
});
});inputNum.html
<button id="btn"> Add new fields </button>
<div id="ip_div"> <form action="{{ url_for("inputNum")}}" method="post">
</div>
<br>
<button type="submit">Submit for addition </button>
<script type=text/javascript src="{{ url_for('static', filename='jquery.js') }}"></script>
<script type=text/javascript src="{{ url_for('static', filename='inputFields.js') }}"></script>
</form>results.html
<!DOCTYPE html>
<title xmlns="http://www.w3.org/1999/html">
<head>
<meta http-equiv="refresh" content="10">
<title>Results</title>
</head>
<body>
<h1>Log file ...</h1>
<script>
// function for adjusting iframe height to log size
function resizeIframe(obj) {
obj.style.height = obj.contentWindow.document.documentElement.scrollHeight + 'px';
}
</script>
<iframe src="{{ url_for('results') }}" frameborder="0" style="overflow:hidden;width:100%" width="100%" frameborder="0" scrolling="no" onload="resizeIframe(this)"></iframe>
</body>
</html>回答 1
Stack Overflow用户
回答已采纳
发布于 2021-07-29 10:55:40
如果你打算在将来继续使用flask来运行你的服务器，我建议你创建一个forms.py文件，并通过python而不是JS来运行你所有的表单，因为它可以更好地使用flask。这里有一篇很好的文章- https://python-adv-web-apps.readthedocs.io/en/latest/flask_forms.html创建表单后，继续阅读这篇文章，了解如何在results.html文件中使用从应用程序路由继承的表单标签。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/68568735
复制相关文章
相似问题
腾讯云开发者
