Попытка передать массивы javascript в Python Flask - PullRequest
0 голосов
/ 20 февраля 2019

Я пытаюсь передать некоторые массивы javascript во Flask для настройки страницы моих шаблонов, но все, что я получаю на выходной странице, это сообщение "В текстовом поле Host, вы ввели: None", вот мой код:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
        <script src="static/script.js"></script>
        <title>Comms Checker</title>
        </head>
        <body>
    <form name="ResultPage" action = "passFails.html" onsubmit="return validateTestPage()" method="post">
         Number of Hosts/Ports:<br><input type="text" id="Number"><br/><br/>
        <a href="#" id="filldetails" onclick="addFields()">Enter Comms Details</a>
        <div id="container"/>
    </form>
    </body>
</html>

приведенный выше код вызывает нижеприведенную функцию javascript:

function addFields(){
            // Number of inputs to create
            var number = document.getElementById("Number").value;

            // Container <div> where dynamic content will be placed
            var container = document.getElementById("container");

            // Clear previous contents of the container
            while (container.hasChildNodes()) {
                container.removeChild(container.lastChild);
            }

            for (var i=1;i<=number;i++){
                container.appendChild(document.createTextNode("Host: " + i));
                var host = document.createElement("input");
                host.type = "text";
                host.id = "Host " + i;
                container.appendChild(host);

                container.appendChild(document.createTextNode("Port: " + i));
                var port = document.createElement("input");
                port.type = "text";
                port.id = "Port " + i;
                container.appendChild(port);

                // Append a line break
                container.appendChild(document.createElement("br"));
                container.appendChild(document.createElement("br"));
}
    var button = document.createElement("input");
    button.setAttribute("type", "button");
    button.setAttribute('value', 'Check');
    button.setAttribute('onclick', 'checkVal()');
    container.appendChild(button);

    return true;
}



function checkVal() {
    var myHost=[];
    var myPort=[];
// Number of inputs to create
    var number = document.getElementById("Number").value;

    for (var i = 1; i <= number; i++) {

        //pass myHost and myPort to first.py for further processing.

         myHost.push(document.getElementById('Host ' + i).value);
         myPort.push(document.getElementById('Port ' + i).value);

        /*alert("Value of Host: " + i + " is: " + myHost[i]);
        alert("Value of Port: " + i + " is: " + myPort[i]);*/
    }

    for (var i=0; i<number; i++){

        alert("Value of Host: " + i + " is: " + myHost[i]);
        alert("Value of Port: " + i + " is: " + myPort[i]);
    }

    $.get(
        url="/passFails",
        data={host: myHost},
        success = function (data) {
            alert('page content: ' + data);
        }
    );
return true
}

код javascript должен передать массив / список «myHost» в Python, но по какой-то причине он не может сделать это безСообщения об ошибках.скрипт Python выглядит следующим образом:

from flask import Flask, render_template, request
import json
import jsonify

app = Flask(__name__)


@app.route('/Results')
def Results():

    return render_template('Results.html')


@app.route('/passFails')
def passFails():
    data = request.args.get('host')
    print("The Value in passFails is :%s " % data)
    return render_template('/passFails.html', Value=data)


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

и, наконец, вышеприведенный скрипт Python должен передать данные на последнюю HTML-страницу passFails.html, где будут напечатаны все значения в массиве / списке.страница passFails выглядит следующим образом

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<h1>In the Host text box, you entered: {{Value}}</h1>

</body>
</html>

Я просто хочу знать, почему код в части javascript не может передать список в python ИЛИ, если в скрипте Python есть что-то не так, что вызывает проблемы вполучать массив?Любая помощь будет принята с благодарностью.

Ответы [ 4 ]

0 голосов
/ 23 февраля 2019

Наконец, я нашел ответ, и все, что мне нужно было сделать, это включить следующий тег script в мой HTML-файл для javascript, чтобы использовать функцию $ .get () для отправки данных в python.Это была проблема, и она успешно решена:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

Спасибо всем вам, ребята, за то, что поделились вашими ответами.

0 голосов
/ 20 февраля 2019

В файле Python необходимо добавить методы = ['POST'], поэтому маршрут вашего приложения должен быть: @app.route('/passFails', methods = ['POST']), а затем вы можете проверить if request.method == 'POST': #write you code

0 голосов
/ 20 февраля 2019

Изменить .get на .getlist

request.args.getlist('host')

примеры

Peace

0 голосов
/ 20 февраля 2019

Если вы добавите отладочную печать в качестве первой строки в passFails, вы увидите что-то вроде этого:

def passFails():
    print(request.args)
    # Out: ImmutableMultiDict([('host[]', '1'), ('host[]', '2'), ('host[]', '3')])

Как вы сказали, вы пытаетесьПередайте некоторые массивы javascript , чтобы ваши запросы выглядели примерно так:

$.get(
    url="/passFails",
    data={host: [1,2,3]},
    success = function (data) {
        alert('page content: ' + data);
    }
);

И они будут конвертированы (что вы можете и в итоге должны увидеть в консоли отладки вашего браузера)на URL-адрес запроса, например:

http://localhost/passFails?host[]=1&host[]=2&host[]=3

Итак, ваше значение не может быть найдено с помощью клавиши host.Чтобы это работало, вы можете использовать request.args.getlist('host[]').Другой вариант - сериализовать значение myHost из массива в строку JSON перед отправкой запроса, чтобы вы могли получить доступ к значению как request.args.get['host'], но вам придется десериализовать его из представления JSON во Flask.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...