How to send datas from python (flask) to javascript?

Question

Hello and happy new year everybody!

I have a practical problem: On my GUI I ask the user to specify a new document name with prompt method when he clicks on "Save As New button"

    $("#btnSaveNew").on( "click", function() {
        var newScenarioName = prompt("Please enter new scenario name", "scenarioX");

    $.ajax({
                 url : 'http://' + document.domain + ':' + location.port + "/saveAsNew",
                 type : 'POST',
                 data : JSON.stringify({'data':data,'newName': newScenarioName}),
                 contentType: 'application/json;charset=UTF-8',
                 success: function (result) {
                            loadScenario();
                    },
            });

My python-flask part ask a cloudant DB to send the file ID matching the specified name, if the name doesn't exist it creates the doc according to the metaData content but if it exists, I have no solution to warn the user

newScenarioName = request.json["newName"]

file_id = getscenario(newScenarioName)
my_doc = my_db[file_id]

metaData = {
    'name': newScenarioName,
    'scenario': data
}

my_doc = my_db.create_document(metaData)

So I'd like to implement something like that

newScenarioName = request.json["newName"]

file_id = getscenario(newScenarioName)
my_doc = my_db[file_id]


if my_doc['name'].exist():
    scenario_exist = True

    ******************
    ** missing part **
    ******************

else:
    metaData = {
        'name': newScenarioName,
        'scenario': data
    }

    my_doc = my_db.create_document(metaData)

where the ** missing part ** includes a send instruction to the .js part that modify a var that I can add so i can make a condition such as

        var newScenarioName = prompt("Please enter new scenario name", "scenarioX");
        if (newScenarioName === null || scenario_exist === True) {
            newScenarioName = prompt("Please enter new scenario name, previous one was null or already used", "scenarioX");
            }

and abort the new scenario creation!

I saw a possible solution on: How to pass variable from python to javascript making a jQuery call, but the thing is, I didn't code the HTML/web-js part so I'm kinda lost in the jQuery possibilities (and with the very technical, not web-noob-friendly manual)

So is there a way on python side to make a method like request.json['key'] but that goes other way (post.json['key'] ? :p) Or maybe call the value .js side with an jQuery/Ajax method?

Thank you for your patience and for reading this issue and sorry for the grammar fault

EDIT: I think the only way to do so is to use websockets, the use of templates with Jinja seems a bit technically too much for me and it's more a bypass than a solution

Flask-Socketio might be what you're looking for.

MrLeeh
– MrLeeh

2017-01-10 17:14:57 +00:00
Commented Jan 10, 2017 at 17:14 — MrLeeh
– MrLeeh, Commented Jan 10, 2017 at 17:14

Manu · Accepted Answer · 2017-01-10 17:44:22Z

0

Ok I just bypass my problem by redefining my ajax method, it calls back the function in case of error

    function saveNewHandler() {
        var newScenarioName = prompt("file name");
        $.ajax({
                 url : 'http://' + document.domain + ':' + location.port + "/saveAsNew",
                 type : 'POST',
                 data : JSON.stringify({'path':scenarioFile, 'data':data, 'name': scenarioName, 'newName': newScenarioName}),
                 contentType: 'application/json;charset=UTF-8',
                 success: function (result) {
                            loadScenario();
                    }
            })
            .error(function(xhr, status, error) {
                console.log(xhr.responseText);
                saveNewHandler(); // ask for new file name 
            });
        }

answered Jan 10, 2017 at 17:44

Manu

3961 gold badge5 silver badges14 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to send datas from python (flask) to javascript?

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related