Estoy escribiendo una aplicación Flask en la que quiero poder usar un formulario para ingresar información en una base de datos sin actualizar la página. Aquí está mi formulario:

 <form id="vocab_form"> <label for="name">Word:</label> <input type="text" id="word" name="word"> <label for="def">Definition</label> <input type="text" id="def" name="def"> <input type="submit" value="Add Term"> </form>

Aquí está el script que estoy usando para enviar la solicitud. Está incrustado en el archivo html que contiene el formulario.

 <script> $(document).on('submit', '#vocab_form', function(e){ e.preventDefault(); $.ajax({ type:'POST', url:'/', data:{ word:$(#word).val(), def:$(#def).val() }, success:function(){ alert('success'); } }) });

Aquí está la ruta a la que estoy enviando los datos del formulario. Llama a funciones en otro archivo para ingresar los datos en mi base de datos y recopilar información en línea con la que representar la página.

 @app.route("/", methods=["GET", "POST"]) def hello(): if request.method == "POST": word = request.form["word"] definition = request.form["def"] query.add_word(word, definition) message="Word added successfully! {} means {}".format(word, definition) else: message="no form data" wordlist=query.get_all_words() lines = web_functions.get_les_mis() return render_template("home.html", message=message, wordlist=wordlist, lines=lines)

Aunque mi secuencia de comandos incluye instrucciones para evitar el comportamiento de envío predeterminado del formulario, la página se vuelve a cargar cada vez que envío el formulario. Quiero prevenir esto. ¡Cualquier consejo o idea sería muy apreciada!