CODEWITHSUNDEEP
javascriptpythonhtmlflask
Avalon
Avalon

Reputation: 49

How do you pass a Javascript variable through POST to use in Flask?

So I have a JS variable that is created after pressing a button, and I need to pass it to my app to process in flask. I'm currently trying to do it with query strings but I'm not really sure what I'm doing.

In the html I have a form set up like this:

<form action="/deleteBook" method="POST" onsubmit="deleteBook()">
                <input type="submit" value="Delete" />
 </form>

which calls this function to apply query string:

function deleteBook() {
        var existingUrl = window.location.href;
        window.location.href = existingUrl + '?itemID=' + itemToRemove;
    };

and then I want to process that variable through flask:

@app.route('/deleteBook', methods=["POST"])
def deleteBook():

if(request.method == "POST"):

    itemID = request.args.get('itemID')

In my mind the code should detect the form submission (basically single button click), call deleteBook() which should then append a query string to the URL which can then be processed in flask.

I'm aware that I'm lacking some basic knowledge about html/js/processing data so I'm not really sure where to go from here. Should I use PHP to process the request somehow? Or should I not be using a form at all? Or maybe in flask there is an easier way to get data without using POST? I'm not sure so any suggestions are appreciated, thanks!

Upvotes: 1

Views: 504

Answers (1)

The Bomb Squad
The Bomb Squad

Reputation: 4327

Well I for one find your style for a question like this unique so I'll try my best to explain my idea of the answer. Firstly, I would just have the form calling the function Secondly, I would have the function call an 'XMLHttpRequest' with 'POST' configuration The HTML

<form onsubmit="deleteBook()">
  <input type="submit" value="Delete " />
</form>

The JavaScript

function deleteBook () {
  var xhr = new XMLHttpRequest();
  xhr.open('POST', existingUrl + '?itemID=' + itemToRemove, true); //The second argument is the url you wish to 'POST' to
  xhr.send(); //if you want to do something if your flask returns something, 'xhd.onload = function () {}'
}

Upvotes: 2

Related Questions