Flask - Llamada a función python en evento OnClick de botón

Question

Más

Fuente Versión no AMP Editar

Flask - Llamada a función python en evento OnClick de botón

Soy nuevo en python y Flask. Tengo una Flask Web App con un botón. Cuando hago clic en el botón me gustaría ejecutar un método python no un método Javascript. ¿Cómo puedo hacerlo?

He visto ejemplos con python donde me redirige a una nueva página usando una etiqueta de formulario como esta

<form action="/newPage" method="post">

pero no quiero que me redirija a una nueva página. Sólo quiero que ejecute el método python. Estoy haciendo esto para un coche robot Raspberry Pi. Cuando pulso el botón de avance, quiero que ejecute el método para Girar las ruedas hacia adelante.

Código HTML del botón (index.html)

<button name="forwardBtn" onclick="move_forward()">Forward</button>

simple app.py Código - move_forward() método situado aquí

#### App.py code

from flask import Flask, render_template, Response, request, redirect, url_for
app = Flask(__name__)

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

def move_forward():
    #Moving forward code
    print("Moving Forward...")

He visto preguntas similares a la mía en Stackoverflow, pero no parecen responder a mi pregunta o no soy capaz de entender la respuesta. Si alguien pudiera proporcionarme una forma sencilla de llamar a un método Python en el evento de clic de un botón, se lo agradecería enormemente.

Otras preguntas que he mirado:

--https://stackoverflow.com/questions/30899484/python-flask-calling-functions-using-buttons

--https://stackoverflow.com/questions/40583347/calling-a-python-function-with-a-button

--https://stackoverflow.com/questions/21566649/flask-button-run-python-without-refreshing-page

Community

Pregunta editada 23º mayo 2017 в 12:17

Programación

javascript python html raspberry-pi flask

4º marzo 2017 в 9:12

4 vistas

Gihan Gamage · Answer 1 · 2018-03-17T10:34:22+00:00

Puedes hacer esto simplemente con la ayuda de AJAX... Aquí hay un ejemplo que llama a una función python que imprime hola sin redirigir o refrescar la página.

En app.py pon el siguiente segmento de código.

//rendering the HTML page which has the button
@app.route('/json')
def json():
    return render_template('json.html')

//background process happening without any refreshing
@app.route('/background_process_test')
def background_process_test():
    print "Hello"
    return "nothing"

Y su página json.html debe tener el siguiente aspecto.

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type=text/javascript>
        $(function() {
          $('a#test').bind('click', function() {
            $.getJSON('/background_process_test',
                function(data) {
              //do nothing
            });
            return false;
          });
        });
</script>

//button
<div class='container'>
    <h3>Test</h3>

            <a href=# id=test>Test</a>


</div>

Aquí, cuando se pulsa el botón Test simple en la consola se puede ver "Hola" se muestra sin ningún tipo de refresco.

Logan Bertram · Answer 2 · 2017-03-17T14:17:12+00:00

Parece que quieres utilizar esta aplicación web como control remoto para tu robot, y una cuestión fundamental es que no querrás que se recargue la página cada vez que realices una acción, en cuyo caso, el último enlace que has publicado responde a tu problema.

Creo que estás malinterpretando algunas cosas sobre Flask. En primer lugar, no se pueden anidar varias funciones en una sola ruta. Usted no está haciendo un conjunto de funciones disponibles para una ruta en particular, usted está definiendo la cosa específica que el servidor hará cuando se llame a esa ruta.

Teniendo esto en cuenta, podrías resolver tu problema con la recarga de la página cambiando tu app.py para que se parezca más a esto:

from flask import Flask, render_template, Response, request, redirect, url_for
app = Flask(__name__)

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

@app.route("/forward/", methods=['POST'])
def move_forward():
    #Moving forward code
    forward_message = "Moving Forward..."
    return render_template('index.html', forward_message=forward_message);

Luego en tu html, usa esto:


    Forward

...para ejecutar tu código de avance. E incluye esto:

{{ forward_message }}

... donde desea que aparezca el mensaje de avance en su plantilla.

Esto hará que su página se recargue, lo cual es inevitable sin utilizar AJAX y Javascript.

user2371563 · Answer 3 · 2019-09-10T06:00:20+00:00

index.html (index.html debe estar en la carpeta templates)





    The jQuery Example

    <h2>jQuery-AJAX in FLASK. Execute function on button click</h2>  

    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"> </script>
    <script type=text/javascript> $(function() { $("#mybutton").click(function (event) { $.getJSON('/SomeFunction', { },
    function(data) { }); return false; }); }); </script> 



        <input type = "button" id = "mybutton" value = "Click Here" />

test.py

from flask import Flask, jsonify, render_template, request
app = Flask(__name__)

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

@app.route('/SomeFunction')
def SomeFunction():
    print('In SomeFunction')
    return "Nothing"

if __name__ == '__main__':
   app.run()