Kirim data dari kotak teks ke Flask?


93

Saya bertanya-tanya apakah ada cara untuk mengambil sesuatu dari kotak teks di HTML, memasukkannya ke dalam termos, lalu mengurai datanya dengan Python. Saya berpikir ini mungkin melibatkan beberapa JS tetapi saya bisa saja salah. Ada ide?


Mengapa tidak menggunakan formulir HTML dan POST langsung? Atau apakah Anda perlu melakukan ini secara asinkron? Dalam hal ini, Anda akan memiliki beberapa bacaan yang harus dilakukan di AJAX. :-)
Martijn Pieters

1
Saya tahu saya bisa menggunakan formulir HTML, tapi bagaimana cara meneruskan info itu ke aplikasi flask?
ollien

Jawaban:


155

Kecuali Anda ingin melakukan sesuatu yang lebih rumit, memasukkan data dari formulir HTML ke Flask sangatlah mudah.

  • Buat tampilan yang menerima permintaan POST ( my_form_post).
  • Akses elemen formulir di kamus request.form.

templates/my-form.html:

<form method="POST">
    <input name="text">
    <input type="submit">
</form>
from flask import Flask, request, render_template

app = Flask(__name__)

@app.route('/')
def my_form():
    return render_template('my-form.html')

@app.route('/', methods=['POST'])
def my_form_post():
    text = request.form['text']
    processed_text = text.upper()
    return processed_text

Ini adalah dokumentasi tentang Flask mengakses data permintaan .

Jika Anda membutuhkan formulir yang lebih rumit yang memerlukan validasi, Anda dapat melihat WTForms dan cara mengintegrasikannya dengan Flask .

Catatan: kecuali Anda memiliki batasan lain, Anda tidak benar-benar membutuhkan JavaScript sama sekali untuk mengirim data Anda (meskipun Anda dapat menggunakannya).


1
Hei, ini berhasil, sekali, tapi sekarang muncul kesalahan 500, ada ide?
ollien

Seharusnya berfungsi dengan baik ... Letakkan app.debug = Truetepat sebelumnya app.run()sehingga Anda mendapatkan pengecualian dan penelusuran kembali kesalahan.
pacha

Ya, saya lupa tentang itu, saya idiot dan lupa meletakkan HTML saya di folder template saya.
ollien

Saya menyia-nyiakan sedikit waktu untuk mencoba melakukan ini dengan textarea yang lebih besar daripada textbox jika ada yang perlu melakukan ini dengan Flask, solusinya ada di sini
cardamom

@ Cardamom Saya tidak begitu mengerti apa yang Anda maksud. Menggunakan textarea atau input jenis teks tidak mengubah solusi dengan cara apa pun (yang Anda tautkan persis sama dengan yang ini). Anda tidak perlu mengubah sisi Python, cukup ganti <input type="text" name="text">dengan <textarea name="text"></textarea>dan Anda akan baik-baik saja.
pacha

9

Deklarasikan titik akhir Flask untuk menerima jenis input POST lalu lakukan langkah-langkah yang diperlukan. Gunakan jQuery untuk memposting data.

from flask import request

@app.route('/parse_data', methods=['GET', 'POST'])
def parse_data(data):
    if request.method == "POST":
         #perform action here
var value = $('.textbox').val();
$.ajax({
  type: 'POST',
  url: "{{ url_for('parse_data') }}",
  data: JSON.stringify(value),
  contentType: 'application/json',
  success: function(data){
    // do something with the received data
  }
});

2

Semua interaksi antara server (aplikasi flask Anda) dan klien (browser) dilakukan berdasarkan permintaan dan respons. Ketika pengguna menekan tombol kirim dalam formulir Anda, browsernya mengirim permintaan dengan formulir ini ke server Anda (aplikasi flask), dan Anda bisa mendapatkan konten dari formulir seperti:

request.args.get('form_name')

1

Dengan asumsi Anda sudah tahu bagaimana menulis pandangan di Flaskrespon bahwa untuk url, membuat satu yang membaca request.postdata. Untuk menambahkan input boxdata posting ini, buat formulir di halaman Anda dengan kotak teks. Anda kemudian dapat menggunakan jqueryuntuk melakukan

var data = $('#<form-id>').serialize()

dan kemudian posting ke tampilan Anda secara asinkron menggunakan sesuatu seperti di bawah ini.

$.post('<your view url>', function(data) {
  $('.result').html(data);
});

0

Ini berhasil untuk saya.

def parse_data():
    if request.method == "POST":
        data = request.get_json()
        print(data['answers'])
        return render_template('output.html', data=data)
$.ajax({
      type: 'POST',
      url: "/parse_data",
      data: JSON.stringify({values}),
      contentType: "application/json;charset=utf-8",
      dataType: "json",
      success: function(data){
        // do something with the received data
      }
    });
Dengan menggunakan situs kami, Anda mengakui telah membaca dan memahami Kebijakan Cookie dan Kebijakan Privasi kami.
Licensed under cc by-sa 3.0 with attribution required.