<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Flask Web Interface</title>
</head>
<body>
<h1>Flask Web Interface</h1>
<button id="sendButton">Send Data to Server</button>
<p id="response"></p>
<script>
document.getElementById("sendButton").addEventListener("click", function() {
// Send data to server
fetch('/send_data', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({data: 'Data from client'}),
})
.then(response => response.json())
.then(data => {
// Handle response from server
document.getElementById("response").innerHTML = data.message;
})
.catch(error => {
console.error('Error:', error);
});
});
</script>
</body>
</html>