0
@app.route('/')
def index():
    users = [[1],[2],[3]]
    return render_template('index.html', users=users)

@app.route('/update', methods=['GET', 'POST'])
def update():
    print(' post received ')
    if request.method == 'POST':
        print(request.form['idval']
    return jsonify({'result': 'success'})

and this is my simple html

{% block body %}
<body>
    {% for user in users %} 
        <td id='position{{user[0]}}' class='updateposition'></td>
        <td id='amount{{user[0]}}' class='updateamount'></td> 
    {% endfor %}

    <script src="http://code.jquery.com/jquery.js"></script>
    <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
    <script src="{{ url_for('static', filename='app.js') }}"></script>
</body>
{% endblock %}

and here's my app.js file within static folder which contains the jquery

$(document).ready(function() {
    setInterval(ajaxCall, 1000);
    function ajaxCall(){

        var positionIds = Array.prototype.slice.call(document.querySelectorAll('.updatecurrposition')).map(function ( element ) { return element.id;});

        var amountIds = Array.prototype.slice.call(document.querySelectorAll('.updatepositionamount')).map(function ( element ) {return element.id;});

    console.log(positionIds[0])

    for (i = 0; i < positionIds.length; i++){
        req = $.ajax({
            url : '/update',
            type : 'POST',
            data : {idval : positionIds[i]}
        });
    }
}

and this example was taken from https://github.com/PrettyPrinted/youtube_video_code/tree/master/2017/03/27/Using%20jQuery%20to%20Update%20a%20Page%20Without%20Refresh%20(Part%201%20of%202)/ajax_without_update

I've literally copied every single tutorials online and tried to implement it in my own (and most of the tutorials themselves fail in my computer for some reason) and it just seems it can't get the data. I get a proper initial 200 response to get the html template but when the POST request does work, it only shows 304 redirect message, but nothing gets printed in the console

this perhaps seems to be the reason when I try to update the value upon receiving the data from the flask server, nothing happens. i.e.

req.done(function(data){
    $('#'+positionIds[i]).text(data.result);
});

adding this right after req = $.ajax seems to change nothing

Kevvy Kim
  • 101
  • 1
  • 7
  • You are not allowing /update to receive POST requests, you have to change the line to @app.route('/update', methods = ["POST", "GET"]) ... does that solve the problem? It might be something else however. – zack256 Jul 08 '20 at 01:45
  • when i was writing this question, I forgot to add the GET and POST methods. In the original code, there are those methods and it still doesn't work – Kevvy Kim Jul 08 '20 at 02:02
  • Try `req.done(data => console.log(data))` if you just want to see if it's working. You're also going to fall into this trap with your current `req.done()` code ~ [JavaScript closure inside loops – simple practical example](https://stackoverflow.com/questions/750486/javascript-closure-inside-loops-simple-practical-example) – Phil Jul 08 '20 at 02:06
  • Are you sending the data with AJAX as JSON? You'll want to access it with `request.json` not `request.form`. – PGHE Jul 08 '20 at 02:09
  • I've included dataType : 'json', and in flask, I did data = request.json and it still doesn't work – Kevvy Kim Jul 08 '20 at 02:23
  • doing req.done(data => console.log(data)) doesn't do anything. probably something deeper – Kevvy Kim Jul 08 '20 at 02:24

1 Answers1

0

Does changing the td tags to something like p work? From tests I think that empty td tags aren't generated. I changed the tags and it was printing (to the console) successfully.

zack256
  • 181
  • 1
  • 5
  • i changed the td tag to p tag and it surely does print to the python flask console now. But the problem is that there seems to be a problem with receiving data from flask and processing it cause it ends up showing [object Object] instead of the actual values – Kevvy Kim Jul 08 '20 at 06:27
  • What prints [object] ? The python or javascript? – zack256 Jul 08 '20 at 07:05