Spaces:
Runtime error
Runtime error
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Chatbot FAQ</title> | |
| <link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}"> | |
| </head> | |
| <body> | |
| <div class="chat-container"> | |
| <div id="chat-box" class="chat-box"></div> | |
| <input type="text" id="user-input" placeholder="Ask a question..." /> | |
| <button id="send-btn">Send</button> | |
| </div> | |
| <script> | |
| document.getElementById("send-btn").addEventListener("click", function() { | |
| var userMessage = document.getElementById("user-input").value; | |
| // Display user message in chat box | |
| var chatBox = document.getElementById("chat-box"); | |
| chatBox.innerHTML += "<p><strong>You:</strong> " + userMessage + "</p>"; | |
| // Send message to backend | |
| fetch('/chat', { | |
| method: 'POST', | |
| body: new URLSearchParams({ 'message': userMessage }), | |
| headers: { 'Content-Type': 'application/x-www-form-urlencoded' } | |
| }) | |
| .then(response => response.json()) | |
| .then(data => { | |
| // Display bot response | |
| chatBox.innerHTML += "<p><strong>Bot:</strong> " + data.response + "</p>"; | |
| document.getElementById("user-input").value = ''; // Clear input field | |
| }); | |
| }); | |
| </script> | |
| </body> | |
| </html> | |