I am not able to open test.html by rendering in flask.
I am trying to send data of a movie card to other page: test.html if the card is clicked.
I have taken the approach of onclick(event) function using embedded javascript.
Please help me in solving the problem mentioned below.
Below is flask route function
@app.route('/handleClick', methods=["GET"])
def handleClick():
title = request.args.get('title')
print(title)
# Render the movie.html template with the data
return render_template('test.html')
/handleClick is called by a embedded javascript on index.html
<script>
function sendData(event){
const clickedCard = event.target.closest('.small_card');
// Extract data from the clicked card
const title = clickedCard.querySelector('.labels h2').textContent;
// Send an AJAX request to the Flask server with the data
var xhr = new XMLHttpRequest();
xhr.open('GET', '/handleClick?title=' + encodeURIComponent(title), true);
xhr.send();
}
</script>
test.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<h1>Hello!</h1>
</body>
</html>
On clicking the card data is sent to flask server, also it getting printed in terminal. But test.html page is not opening.
I checked network panel of developer mode, there test.html is not getting displayed.
XmlHttpRequest.send() makes an http request, but it doesn't automatically do anything with the response -- that's up to your code.
If you want the browser to show a new page, you don't need XmlHttpRequest (or even fetch() which is an easier / more modern interface), you just want to set window.location.href to the new URL.