formタグの値をrequestで取得することができません

Question

前提・実現したいこと

簡易的な検索フォームを作りたくて、HTML側で<select> ~ <option>タグを使用し選択肢を作り、選択した項目をrequest.form.getを使い取得し、その取得した値をexecuteを使いデータベースを参照してその結果を表示する仕組みを作りたいのですが、そもそものHTML側で選択、入力した値をPython側で取得することができません。

発生している問題・エラーメッセージ

該当のソースコード

Python, html

HTML

<form action="/kensaku" , method="POST">
        <ul>
            <li>毛色
                <select name="color">
                    <option value="">--- 選択 ---</option>
                    <option name="brown" value="茶">茶</option>
                    <option name="white" value="白">白</option>
                    <option name="black" value="黒">黒</option>
                </select>
            </li>
            <li>とし
                <select name="age">
                    <option value="">--- 選択 ---</option>
                    <option name="kid" value="仔猫">仔猫</option>
                    <option name="adult" value="成猫">成猫</option>
                    <option name="old" value="老猫">老猫</option>
                </select>
            </li>
            <li>サクラ
                <select name="ear">
                    <option value="">------- 選択 -------</option>
                    <option name="cut" value="サクラ">サクラ</option>
                    <option name="nocut" value="サクラじゃない">サクラじゃない</option>
                </select>
            </li>
            <li>
                <a href="/kensaku">検索</a>
            </li>
        </ul>
    </form>

--------------------------------------------------------

Python 

@app.route("/search", methods=["POST"])
def search():
    color = request.form.get("color")
    age = request.form.get("age")
    ear = request.form.get("ear")
    
    print(color)

    conn = sqlite3.connect('cat.db')
    c = conn.cursor()
    c.execute("select color, age, ear from cat where color = ? and age = ? and ear = ? order by id DESC limit 10" (color, age, ear))
    conn.commit()
    conn.close()
    
    return redirect("/kensaku")

試したこと

補足情報（FW/ツールのバージョンなど）

Comments

[azuapricot]

requestの中身はみてみました？ requestの中身が空なんですか？

[退会済みユーザー]

はい。printで確認しましたが何も出力されなかったので、formとrequestが機能していない気がするんですが何処が間違っているのか分からなくて...。質問下手ですいません...。

[azuapricot]

action="/search" じゃなくて action="/kensaku" なんですか？
@app.route("/search", methods=["POST"]) って書いてありますが・・・（？？）

[azuapricot]

Flaskでしょうか。
https://qiita.com/SKYS/items/e4c62d7de015574e6db6
↑
で似たようなことやってます
今 action=/kensaku となっているのでただリダイレクトしているだけなのでは？

[退会済みユーザー]

検索フォームのページを"/search"、検索結果を表示するページを"/kensaku"と設定していて、action内には実行後に移行するページのURLを記入すると教わったので、"/kensaku"と記入しましたが違うんでしょうか...？

[退会済みユーザー]

参考記事、ありがとうございます。
もう一度自分で色々試してみようと思います。

[azuapricot]

/searchで /kensakuにリダイレクトしてるじゃないですか・・・？

[azuapricot]

action="呼びたいパス(今回なら/search)"
python で該当パスが設定されている関数が呼ばれる
↓
今回は処理後に /kensakuへリダイレクト＝/kensaku画面が再表示される

[退会済みユーザー]

redirectを指定してしまったせいで、"/search"で入力した内容が反映されることなく"/kensaku"が表示されてしまうという解釈で合っていますか？

[azuapricot]

うーんと・・・？
現時点で、この
@app.route("/search", methods=["POST"])
def search():

この関数内には入ってきてるんでしょうか？

[退会済みユーザー]

入ってきていないです...。
HTML側に"form"タグを設定して、Python側で"request.form.get"で値を取得できると考えていたのですが反映されませんでした...。

[azuapricot]

入ってきてないですよね？安心しました（）
入ってこない理由は、<form action="/kensaku"> なっているから、といえば伝わりますでしょうか。

def search()を呼ぶためには、あなたが『ルーティング』したパスを actionに設定してあげる必要があります。

@app.route("/search", ) ←　これ

<form>タグの action を /search に書き換えたらどうなりますか？

[退会済みユーザー]

"/search"に書き換えてみましたが反応しませんでした...。
"print(color)"から何の反応もない時点で"request"が機能していないという事ですよね？

[azuapricot]

print(color) じゃなくて、 print("てすと")　のようにそこの関数を通っているか確認できますか？

[azuapricot]

あと考えられるのはここですかね
<a href="/kensaku">検索</a>

もしこれでsubmitしたと思っているなら間違ってます・・・（ただ /kensakuへアクセスしてるだけ）

<button type="submit">検索</button>
に変えてみる、とかでしょうか

[退会済みユーザー]

"print("test")"と入力して実行してみましたが、何も反映されませんでした！
これはそもそもPython側のコーディングの仕方が間違っているという事ですか？

[azuapricot]

追記しましたが、検索ボタンがよろしくないと思います。
（そもそもPOST送信できてない）

[退会済みユーザー]

検索ボタンを修正したら行けるようになりました！！
"form"と"request"に気を取られてしまって全く考えにありませんでした????
親切に回答していただきましてありがとうございました！！

[azuapricot]

よかったです～

Answer 1

これでPythonの関数にとびませんか？

<form action="/search" , method="POST">
    <ul>
        <li>毛色
            <select name="color">
                <option value="">--- 選択 ---</option>
                <option name="brown" value="茶">茶</option>
                <option name="white" value="白">白</option>
                <option name="black" value="黒">黒</option>
            </select>
        </li>
        <li>とし
            <select name="age">
                <option value="">--- 選択 ---</option>
                <option name="kid" value="仔猫">仔猫</option>
                <option name="adult" value="成猫">成猫</option>
                <option name="old" value="老猫">老猫</option>
            </select>
        </li>
        <li>サクラ
            <select name="ear">
                <option value="">------- 選択 -------</option>
                <option name="cut" value="サクラ">サクラ</option>
                <option name="nocut" value="サクラじゃない">サクラじゃない</option>
            </select>
        </li>
        <li>
            <button type="submit">検索</button>
        </li>
    </ul>
</form>

Comments

[退会済みユーザー]

拙い質問内容から丁寧にくみ取っていただいて感謝しかありません！
ありがとうございました！！