如何使用 Jinja2 html 模板在 Flask 服务器上调用 python 函数？

Question

I recently started to learn to use the Flask framework.我最近开始学习使用 Flask 框架。 However, I am a bit confused on how to call function 'sign_in_check' from main.py, when a button is clicked in the html template.但是，当在 html 模板中单击按钮时，我对如何从 main.py 调用函数“sign_in_check”感到有些困惑。 In Django, it is as simple as <form action = "{{% url 'sign_in_check' %}}> . However if I try doing the same thing with Flask, it returns an error. I have been googling a solution to this with no luck. Here is my code, I am aware that flask has better built in functionality for sign in, however I still need to know how to call functions from templates because I have other pages that require a python function to run.在 Django 中，它就像<form action = "{{% url 'sign_in_check' %}}> 。但是，如果我尝试用 Flask 做同样的事情，它会返回一个错误。我一直在用谷歌搜索解决方案没运气。这是我的代码，我知道flask具有更好的内置登录功能，但是我仍然需要知道如何从模板调用函数，因为我还有其他页面需要运行python函数。

main.py主文件

from flask import Flask, render_template, request, current_app
from flask_socketio import SocketIO, send

app = Flask(__name__)
app.config['SECRET_KEY'] = 'mysecret'
socketio = SocketIO(app)

@app.route('/')
def sign_in():
    return render_template('sign_in.html', sign_in_check_func =       sign_in_check)

@app.route('/sign_in_check')
def sign_in_check():
    print("In Sign In Check")
    if request.method == "POST":
        driver_first_name = request.POST.get('driver_first_name', '')
        driver_last_name = request.POST.get('driver_last_name', '')
        driver_WWID = request.POST.get('driver_WWID', '')

        co_driver_first_name = request.POST.get('co_driver_first_name', '')
        co_driver_first_name = request.POST.get('co_driver_last_name', '')
        co_driver_WWID = request.POST.get('co_driver_WWID', '')

        car_number = request.POST.get('car_number', '')

        c = {'driver_first_name':driver_first_name, 'driver_last_name':driver_last_name,
    'driver_WWID':driver_WWID,  'co_driver_first_name':co_driver_first_name,
    'co_driver_last_name':co_driver_last_name, 'co_driver_WWID':co_driver_WWID,}

        if driver_first_name != "" and driver_last_name != "" and driver_WWID != "" and co_driver_first_name != "" and co_driver_last_name != "" and co_driver_WWID != "":

            return render_template('pre_drive_inspection.html')
    return render_template('sign_in.html')

sign_in.html登录.html

<!DOCTYPE html>
{% extends "base.html" %}
{% block main_content %}
  <html>
  <link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='css/sign_in.css') }}">
    <body>
        <div id="driver_info">
              <li>
                <label for="driver_first_name">Driver First Name:</label>
                 <input type="text" name="driver_first_name" value="{{driver_first_name }}" id="driver_first_name">
              </li>
              <li>
                <label for="driver_last_name">Driver Last Name:</label>
                  <input type="text" name="driver_last_name" value = "{{driver_last_name }}" id="driver_last_name">
              </li>
              <li>
                <label for="driver_wwid">Driver WWID:</label>
                  <input type="text" name="driver_WWID" value="{{driver_WWID }}" id="driver_WWID" maxlength="8"
                    onkeypress="return (event.charCode == 8 || event.charCode == 0) ? null : event.charCode >= 48 && event.charCode <= 57">
              </li>
          </div>

          <div id="co-driver_info"  >
            <li>
              <label for="co_driver_first_name">CO-Driver First Name:</label>
                <input type="text" name="co_driver_first_name" value="{{co_driver_first_name }}" id="co_driver_first_name">
           </li>
           <li>
              <label for="co_driver_last_name">CO-Driver Last Name:</label>
              <input type="text" name="co_driver_last_name" value="{{ co_driver_last_name }}" id="co_driver_last_name">
           </li>
           <li>
              <label for="co_driver_wwid">CO-Driver WWID:</label>
                <input type="text" name="co_driver_WWID" value="{{ co_driver_WWID }}" id="co_driver_WWID" maxlength="8"
              onkeypress="return (event.charCode == 8 || event.charCode == 0) ? null : event.charCode >= 48 && event.charCode <= 57">
           </li>
          </div>

          <div id="car_number">
            <li>
              <label for="car_number">Car Number:</label>
              <input type="text" name="car_number" value="{{ car_number }}" id="co_driver_WWID" maxlength="4"
            onkeypress="return (event.charCode == 8 || event.charCode == 0) ? null : event.charCode >= 48 && event.charCode <= 57">        </li>
           </li>
          </div>

          <button action="{{% url_for('sign_in_check') %}}" method="post" value = "{{ csrf_token }}">

            <div id="button">
              <li>
                <input type="submit" value="Continue">
              </li>
            </div>

          </button>

    </body>
  </html>
{% endblock %}

Answer 1

This is an HTML issue.这是一个 HTML 问题。

Buttons don't have actions.按钮没有动作。 Buttons belong in forms, and the form has an action attribute.按钮属于表单，表单有一个 action 属性。

<form action="{{% url_for('sign_in_check') %}}" method="post">

    <input type="hidden" value = "{{ csrf_token }}">
    <div id="driver_info">
          <li>
            <label for="driver_first_name">Driver First Name:</label>
             <input type="text" name="driver_first_name" value="{{driver_first_name }}" id="driver_first_name">
          </li>
          ...
        </div>

        <div id="button">
          <li>
            <input type="submit" value="Continue">
          </li>
        </div>
</form>

Note, there are lots of other things wrong with your HTML as well.请注意，您的 HTML 也有很多其他问题。 For example, you can't have a body element after a div;例如，你不能在div后面有body元素； that div belongs in the body.该 div 属于正文。 And li elements must go inside a ul element (or ol ).并且li元素必须进入ul元素（或ol ）。

Also, your parent "base.html" template should be providing the basic page structure including the HTML declaration, and the head and body elements;此外，您的父“base.html”模板应该提供基本的页面结构，包括 HTML 声明、 head和body元素； your child template should simply fill in the space inside the body.您的子模板应该简单地填充主体内部的空间。

Answer 2

After more googling I figured it out.经过更多的谷歌搜索，我想通了。 If anyone is curious, I took Daniel's advice and restructured the html.如果有人好奇，我接受了丹尼尔的建议并重组了 html。 However, that didn't completely fix it.然而，这并没有完全解决它。 The action sytanx was:动作语法是：

<form action='/sign_in_check' method="POST">

and then the server handled it like so:然后服务器像这样处理它：

@app.route('/sign_in_check', methods = ['GET', 'POST'])
def sign_in_check():
  if request.method == 'POST':

I had to make sure the function accepted POST or GET.我必须确保该函数接受 POST 或 GET。 Also, unlike django, the request syntax for flask is a bit different.此外，与 django 不同，flask 的请求语法有点不同。 Like so,像这样，

driver_first_name = request.form.get('driver_first_name')

Hope this helps anyone else that had similar problems.希望这可以帮助其他遇到类似问题的人。

如何使用 Jinja2 html 模板在 Flask 服务器上调用 python 函数？

问题描述

2 个解决方案

解决方案1
1 2017-03-08 20:06:13

解决方案2
0 已采纳 2017-03-08 21:01:56

如何使用 Jinja2 html 模板在 Flask 服务器上调用 python 函数？

问题描述

2 个解决方案

解决方案1 1 2017-03-08 20:06:13

解决方案2 0 已采纳 2017-03-08 21:01:56

解决方案1
1 2017-03-08 20:06:13

解决方案2
0 已采纳 2017-03-08 21:01:56