Python Flask – Enviando dados de formulário para modelos HTML

Você pode precisar do Flask enviando dados de formulário para modelos HTML para criar aplicativos da Web interativos.

Ao passar dados do lado do servidor para o lado do cliente, você pode criar interfaces de usuário personalizadas que permitem que os usuários insiram dados e interajam com seu aplicativo.

Neste artigo, exploraremos o processo do Flask enviando dados de formulário para modelos HTML com exemplos.



Flask enviando dados de formulário para modelos HTML

Como observamos anteriormente, o método http pode ser designado dentro da regra de URL. A função ativada pela URL pode obter os dados do formulário como um objeto de dicionário e transmiti-los a um modelo para exibição na página da Web relevante.

A instância a seguir mostra que quando a URL contendo ' / ' é acessada, ela exibe uma página da Web chamada ' form.html ', que inclui um formulário. Após o preenchimento do formulário, os dados são enviados para a URL ' /output ' que então ativa a função chamada output() . Esta função recupera os dados preenchidos no formulário e os converte em um objeto dicionário. Posteriormente, esse objeto é encaminhado para o arquivo output.html para exibição.

O modelo HTML exibe os dados do formulário em um formato de tabela dinamicamente.

A seguir está o código Python para o aplicativo flask :

from flask import Flask, render_template, request
app = Flask(__name__)

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

@app.route('/output',methods = ['POST', 'GET'])
def output():
if request.method == 'POST':
language = request.form
return render_template("output.html",output = language)

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

O script HTML para form.html é fornecido abaixo:

<html>
<body>
<form action = "http://localhost:5000/output" method = "POST">
<h1>Programming Languages</h1>
<p>Language 1: <input type = "text" name = "1" /></p>
<p>Language 2: <input type = "text" name = "2" /></p>
<p>Language 3: <input type = "text" name = "3" /></p>
<p>Language 4: <input type ="text" name = "4" /></p>
<p>Language 5: <input type ="text" name = "5" /></p>
<p><input type = "submit" value = "submit" /></p>
</form>
</body>
</html>

O código do modelo para output.html é apresentado abaixo:

<!doctype html>
<html>
<body>
<h1>Programming Languages</h1>
<table border = 4>
<tr>
<th>RANK</th>
<th>LANGUAGE</th>
</tr>
{% for key, value in output.items() %}
<tr>
<th> {{ key }} </th>
<td> {{ value }} </td>
</tr>
{% endfor %}
</table>
</body>
</html>

Saída

Execute o código Python e digite o endereço da web http://localhost:5000/ em seu navegador .

Após clicar no botão Enviar, os dados inseridos no formulário serão exibidos na página output.html na forma de uma tabela HTML.

A seguir está o código do flask Python para o programa Movies Suggestion:

from flask import Flask, render_template, request
app = Flask(__name__)

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

@app.route('/show', methods = ['GET','POST'])
def suggestions():
if request.method == 'POST':
suggestion = request.form
return render_template('output.html', output = suggestion)

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

código form.html para programa de sugestões de filmes:

<html>
<body>
<form action = "http://localhost:5000/show" method = "POST">
<h1>Movies Suggestions</h1>
<p>Rom-Com: <input type = "text" name = "Rom-Com" /></p>
<p>Action: <input type = "text" name = "Action" /></p>
<p>Thriller: <input type = "text" name = "Thriller" /></p>
<p>Sci-Fi: <input type ="text" name = "Sci-Fi" /></p>
<p>Mystery: <input type ="text" name = "Mystery" /></p>
<p><input type = "submit" value = "submit" /></p>
</form>
</body>
</html>

Este arquivo output.html renderiza as sugestões que preenchemos no formulário:

<!doctype html>
<html>
<body>
<h1>Movies Suggestions</h1>
<table border = 4>
<tr>
<th>Genre</th>
<th>Movie</th>
</tr>
{% for key, value in output.items() %}
<tr>
<th> {{ key }} </th>
<td> {{ value }} </td>
</tr>
{% endfor %}
</table>
</body>
</html>

Saída

A primeira página do programa mostra o seguinte formulário:

Assim que o botão Enviar for pressionado, as informações fornecidas no formulário aparecerão na página output.html como uma tabela HTML.

Exemplo de Explicação

  • O código é para um aplicativo web Flask com duas rotas: “/” e “/show”.
  • A rota “/” chama a função movie_form() que usa o arquivo de modelo form.html para renderizar um formulário HTML.
  • A rota “/show” chama a função sugestões () quando o formulário na página form.html é submetido.
  • Se o método de solicitação HTTP for POST, a função sugestões() recupera os dados do formulário usando o objeto request.form e os atribui a uma variável chamada “sugestão”.
  • A função sugestões () então retorna o arquivo de modelo output.html com os dados do formulário passados ​​como uma variável chamada “saída”.
  • O arquivo output.html exibe os dados do formulário em um formato de tabela.
  • A instrução __name__ == '__main__' garante que o aplicativo web Flask seja executado somente quando o script for executado diretamente.
  • Por fim, a instrução app.run(debug=True) executa o aplicativo Flask com o modo de depuração ativado para facilitar a depuração com mensagens de erro detalhadas.

Importância

O envio de dados de formulário do Flask para um modelo é um recurso essencial que permite que o aplicativo web do Flask receba entradas do usuário e as exiba de maneira apresentável.

Aqui estão algumas das principais razões pelas quais enviar dados de formulário para um modelo no Flask é importante:

  1. Ao enviar dados de formulário para um modelo, os aplicativos web Flask podem fornecer interatividade e permitir que os usuários interajam com o aplicativo enviando formulários com dados como texto, imagens e arquivos.
  2. Os usuários podem inserir dados, como credenciais de login ou feedback, por meio de formulários que são enviados e armazenados no banco de dados de back-end para uso futuro.
  3. Os modelos Flask facilitam a formatação e a exibição de dados recebidos de um formulário de maneira apresentável, como tabelas, gráficos e tabelas.
  4. Os modelos Flask podem ser personalizados para combinar com o estilo e o tema do aplicativo, proporcionando uma experiência de usuário perfeita.
  5. Os modelos Flask podem ser reutilizados várias vezes e podem ser adaptados para trabalhar com diferentes formulários, tornando o processo de construção de aplicativos Flask mais eficiente.

Conclusão

A capacidade do Flask de enviar dados de formulário para um modelo é vital, pois permite que os aplicativos da Web do Flask obtenham entradas do usuário e as exibam de uma maneira fácil de compreender pelos usuários. Esse recurso permite interatividade, entrada do usuário, apresentação, personalização e eficiência. Os modelos Flask podem organizar dados em vários formatos, como tabelas, gráficos e gráficos, que ajudam os usuários a entender melhor os dados. Além disso, os modelos do Flask podem ser personalizados de acordo com o design e a aparência do aplicativo, criando uma experiência de usuário tranquila. A transmissão de dados de formulário para um modelo no Flask é um componente crítico do desenvolvimento de aplicativos da Web que melhoram a funcionalidade do aplicativo e a experiência do usuário.

Nós valorizamos o seu feedback.
+1
0
+1
0
+1
0
+1
0
+1
0
+1
0
+1
0

Assine a nossa newsletter
Digite seu e-mail para receber um resumo semanal de nossos melhores posts. Saber mais!
ícone