LiveSearch Flask и Ajax возвращает undefined - PullRequest
Новая
       50

LiveSearch Flask и Ajax возвращает undefined

0 голосов
/ 16 июня 2020

Я хотел создать LiveSearch в Flask. Я попробовал. Я подключаюсь к своей базе данных sqlite. В БД у меня всего четыре записи для тестирования. Если я начинаю flask и пишу в поле ввода, например, «P», я получаю только 4x « Undefinded » в результате, а не желаемые записи из базы данных, такие как » ПЭТ »,« ПА6 »,« ПЭ-ЛТ »и так далее. Я сижу часами, пробую и искал везде и не знаю, что делаю не так. Надеюсь, вы можете мне помочь ...

Вот мои коды, которые я использую: search.py

from flask import Flask, render_template, jsonify, request
import sqlite3 as sql


app = Flask(__name__)


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


@app.route("/livesearch", methods=["POST", "GET"])
def livesearch():
    searchbox = request.form.get("text")
    con = sql.connect("DIMOP.db")
    cur = con.cursor()
    cur.execute("""SELECT Kennwert FROM Materialien WHERE Kennwert LIKE ?""", ('%'+searchbox+'%', ))
    result = cur.fetchall()
    return jsonify(result)


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

index.html: 

<!DOCTYPE html>
<html>
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
</head>
<body>
<input type="text" id="livebox">
<p id="datalist"></p>
<script type=text/javascript>
    $(document).ready(function(){
        $("#livebox").on("input",function(e){
            textinlivebox = $("#livebox").val();
            $.ajax({
                method:"post",
                url:"/livesearch",
                data:{text:textinlivebox},
                success:function(res){
                    var data = "<ul>";
                    $.each(res,function(index,value){
                        data += "<li>"+value.Kennwert+"</li>";
                    });
                    data += "</ul>";
                    $("#datalist").html(data);
                }
            });
        });
    });
</script>
</body>
</html>
...