如何将字符串从HTML传递到Python,然后再传递回HTML [英] How to pass strings from HTML to Python and back to HTML

查看:148
本文介绍了如何将字符串从HTML传递到Python,然后再传递回HTML的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

背景:

我创建了一个非常简单的前端,用户可以在其中输入字符串。输入并单击检查按钮后,我想将此字符串作为JSON传递给python字符串,在此它将执行SQL查找。基于SQL外观,python脚本应传递一个布尔值,该值应更改?

I have created a very simple front end, where the user can input strings. Once entered and "check" button is clicked, I would like to pass this string as a JSON to a python string where it will do a SQL look up. Based on the SQL look the python script should pass a boolean value which should change the ? to a ✔ or a ✘.

问题:

如何通过一旦将 check按钮作为JSON按下到Python脚本上,然后将一个布尔值从Python传递到HTML,以将?更改为✔或✘?

How can I pass on a string once the "check' button is pressed as a JSON to a Python script, and pass a Boolean from Python to HTML to change the ? to a ✔ or a ✘?

研究:

  • How to pass a jquery variable to a Python script?
  • Send and receive data using FLASK and jquery

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
body {font-family: Arial, Helvetica, sans-serif;}
* {box-sizing: border-box;}

input[type=text], select, textarea {
  width: 100%;
  padding: 12px;
  border: 1px solid #ccc;
  border-radius: 4px;
  box-sizing: border-box;
  margin-top: 6px;
  margin-bottom: 16px;
  resize: vertical;
}

input[type=submit] {
  background-color: #4CAF50;
  color: white;
  padding: 12px 20px;
  border: none;
  border-radius: 4px;
  cursor: pointer;
}

input[type=submit]:hover {
  background-color: #45a049;
}

.container {
  border-radius: 5px;
  background-color: #f2f2f2;
  padding: 20px;
}


  h3 {text-align: center;}
  .center {
            display: flex;
            justify-content: center;
            align-items: center;
            }
    </style>

</style>
</head>
<body>

<h3>My Request</h3>

<div class="container">
  <form action="/action_page.php">
  
<label for="account_name">? Account Name:</label>
<input type="text" id="fname" name="firstname" placeholder="Account Name..">
<input type="submit" value="Check Account"><br><br>

<label for="contact_name">? Contact Name:</label>
<input type="text" id="lname" name="lastname" placeholder="Contact Name..">
<input type="submit" value="Check Contact"><br><br>


<label for="reseller">? Reseller:</label>
<input type="text" id="lname" name="lastname" placeholder="Reseller..">
<input type="submit" value="Check Reseller"><br><br>

<label for="issue_date">? Issue Date:</label><br>
<input type="date" id="start" name="trip-start" value="" min="2018-01-01" max="2100-12-31">

 
<br>
<div class="center">
    <input type="submit" value="VERIFY ALL">
</div>
  </form>
</div>

</body>
</html>

推荐答案

这只是一个示例代码,它将使您了解如何将值从客户端传递到服务器以及从服务器传递到客户端。

This is just a sample code, which will make you understand how to pass values from client to server as well as server to client.

假设:烧瓶是您当前的工作目录

Asumption: 'Flask' is you current working directory

请按照以下步骤操作:


  1. 安装烧瓶

  1. Install Flask

运行以下命令

pip install Flask




  1. 创建python文件 app.py ,将以下内容复制粘贴到此文件。

  1. Create a python file app.py, copy paste the below content into this file.



from flask import Flask, render_template, request

app = Flask(__name__)


@app.route('/')
def index():
    return render_template('index.html')


@app.route('/greet', methods=['POST'])
def greet():
    name = request.form['name']
    return render_template('greet.html', name=name)


if __name__ == '__main__':
    app.run()




  1. 在位置 / Flasak / templates中以

  1. Create a file index.html in location '/Flasak/templates' as

$ b $创建文件 index.html b

<h1>Welcome</h1>
<form action="http://localhost:5000/greet" method="POST">
    Name: <input type="text" name="name"> <button type="submit">Submit</button>
</form>




  1. 创建文件 greet.html 在位置 / Flasak / templates中

  1. Create a file greet.html in location '/Flasak/templates' as



<h2>Have a good day, {{name}}</h2>




  1. 按如下所示运行python文件



python app.py




  1. 打开浏览器,然后按 http:// localhost:5000 ,它将显示 welcome(欢迎)以及用于输入名称的字段。提供您的姓名,然后点击提交。像这样,您可以将值从客户端发送到服务器。

  1. Open a browser and hit http://localhost:5000, it will display 'welcome', along with a field to input name. Provide your name and hit Submit. Like this you can send the values to server from client.

提交后,将发生重定向,服务器将收到名称并将其再次发送给客户端。现在您应该能够看到祝您有美好的一天,以及提供的名称。

After pressing Submit, redirection will happen, the server will receive name and send it again to client. Now you should be able to see Have a good day, along with the name provided.

仅供参考,该项目的目录如下所示:

Just for your reference the project's directory will be looking like below:

Flask
  |
  |-> templates
  |    |
  |    |-> greet.html
  |    |-> index.html
  |
  |-> app.py

注意:为了更好地理解,我建议您通过教程。希望对您有帮助。

Note: For better understanding, I would recommend you to go through tutorials. I hope this was helpful to you.

这篇关于如何将字符串从HTML传递到Python,然后再传递回HTML的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆