python - How can I pass JSON of flask to Javascript - Stack Overflow

I have an index page, which contains a form, fill in the form and sends the data to a URL, which captur

I have an index page, which contains a form, fill in the form and sends the data to a URL, which captures the input, and does the search in the database, returning a JSON. How do I get this JSON, and put it on another HTML page using Javascript?

Form of index:

<form action="{{ url_for('returnOne') }}", method="GET">
<p>Nome: <input type="text" name="nome" /></p>
<input type="submit" value="Pesquisar">
</form>

My function that returns JSON:

@app.route('/userQuery', methods=['GET'])
def returnOne():
    dao = Dao()
    nome = request.args.get('nome')
    return jsonify(json.loads(dao.select(nome)))

I have an index page, which contains a form, fill in the form and sends the data to a URL, which captures the input, and does the search in the database, returning a JSON. How do I get this JSON, and put it on another HTML page using Javascript?

Form of index:

<form action="{{ url_for('returnOne') }}", method="GET">
<p>Nome: <input type="text" name="nome" /></p>
<input type="submit" value="Pesquisar">
</form>

My function that returns JSON:

@app.route('/userQuery', methods=['GET'])
def returnOne():
    dao = Dao()
    nome = request.args.get('nome')
    return jsonify(json.loads(dao.select(nome)))
Share Improve this question edited Mar 31, 2018 at 19:30 Brian Tompsett - 汤莱恩 5,89372 gold badges61 silver badges133 bronze badges asked Mar 31, 2018 at 18:09 Matheus AlcântaraMatheus Alcântara 5771 gold badge5 silver badges5 bronze badges 3
  • You can use jQuery's $.get('http://localhost:8080/userQuery'); to store the JSON to a local variable. – SomeGuyOnAComputer Commented Mar 31, 2018 at 18:11
  • and how can i do this? and to call another page html? where I call the page in return? – Matheus Alcântara Commented Mar 31, 2018 at 18:16
  • I need to get the json and call another page html, i can do this with one route? – Matheus Alcântara Commented Mar 31, 2018 at 18:18
Add a ment  | 

2 Answers 2

Reset to default 6

Your HTML page after you submit the form. let's call it response.html

<!DOCTYPE html>
<html>
<head>
    <title>hello</title>
</head>
<body>
    <p id="test"></p>
    <p id="test1"></p>


    <script>
        var b = JSON.parse('{{ a | tojson | safe}}');
        document.getElementById('test').innerHTML = b.test;
        document.getElementById('test1').innerHTML = b.test1;
        console.log(b);
    </script>

</body>
</html>

Your flask function that sends JOSN and redirects to response.html

@app.route('/userQuery', methods=["POST", "GET"])
def returnOne():
        a = {
        "test": "abcd",
        "test1": "efg"
        }
        return render_template("response.html", a=a)

Use ajax request. This plugin transform the submit button in your HTML form to an Ajax submit

<script> 
    $(document).ready(function() { 
        // bind 'myForm' and provide a simple callback function 
        $('#myForm').ajaxForm(function(response) { 
            var result = jQuery.parseJSON(response);
            $('#someDiv').innerHTML = result.res
        }); 
    }); 
</script>

Use the correct form Id

发布者:admin,转转请注明出处:http://www.yc00.com/questions/1745597477a4635201.html

相关推荐

  • python - How can I pass JSON of flask to Javascript - Stack Overflow

    I have an index page, which contains a form, fill in the form and sends the data to a URL, which captur

    14小时前
    30

发表回复

评论列表(0条)

  • 暂无评论

联系我们

400-800-8888

在线咨询: QQ交谈

邮件:admin@example.com

工作时间:周一至周五,9:30-18:30,节假日休息

关注微信