x-Editable with back end in Flask, how to sent data

Question

I'm trying to send data to python (flask) using x-Editable. Trying to use basic example from x-Editable documentation but I guess I'm doing something wrong with flask back end.

My goal is to print(request.form['username']) in python console.

The only results have:

(after trying modify 'superuser' in html)

Python console:

0.240.0.195 - - [11/Jan/2017 00:14:53] "GET / HTTP/1.1" 200 -

10.240.1.45 - - [11/Jan/2017 00:14:54] "GET /static/js/xeditable.js HTTP/1.1" 200 -

(after trying modify 'status 2' in html)

Python console:

10.240.0.181 - - [11/Jan/2017 00:16:59] "POST /post HTTP/1.1" 400 -

HTML console:

jquery-3.1.1.min.js:4 POST https://-------/post 400 (Bad Request)

HTML:

<!-- Load jQuery 3.1-->
<script  type="text/javascript" src="https://code.jquery.com/jquery-3.1.1.min.js"  integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8="  crossorigin="anonymous"> </script> 

<!--Bootstrap -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>

<!-- Xeditable Bootstrap -->
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/x-editable/1.5.0/bootstrap3-editable/css/bootstrap-editable.css" />
<script src="//cdnjs.cloudflare.com/ajax/libs/x-editable/1.5.0/bootstrap3-editable/js/bootstrap-editable.min.js"></script>

<!-- Xeditable -->
<script type="text/javascript" src="static/js/xeditable.js"> </script>

  <div>
    <span>Username:</span>
    <a href="#" id="username" data-type="text" data-placement="right" data-title="Enter username">superuser</a>
  </div>

  <div>
    <span>Status:</span>
    <a href="#" id="status"></a>
  </div>

jQuery:

$(document).ready(function() {
    //toggle `popup` / `inline` mode
    $.fn.editable.defaults.mode = 'popup';     

    //make username editable
    $('#username').editable(),



    //make status editable
    $('#status').editable({
        type: 'select',
        title: 'Select status',
        placement: 'right',
        value: 2,
        source: [
            {value: 1, text: 'status 1'},
            {value: 2, text: 'status 2'},
            {value: 3, text: 'status 3'}
        ]
        ,pk: 1
        ,url: '/post'


    });
});

Python:

from flask import Flask, render_template, request
import os


app = Flask(__name__)


@app.route('/')
def start_page():
    return render_template('index.html')

@app.route('/post', methods=['POST', 'GET'])
def signUpUse():
    if request.method == 'POST':
        print(request.form['username'])

if __name__ == '__main__':
    host = os.getenv('IP', '0.0.0.0')
    port = int(os.getenv('PORT', 5000))
    app.debug = True
    app.run(host=host, port=port)

Answer 1

To print username I shouldn't use

print(request.form['username'])

but

print(request.form['value'])