Spaces:
Sleeping
Sleeping
| <html> | |
| <head> | |
| <title>University Admission Chatbot</title> | |
| <style> | |
| body{ | |
| font-family: Arial; | |
| background:#f4f4f4; | |
| text-align:center; | |
| } | |
| #chatbox{ | |
| width:400px; | |
| height:400px; | |
| margin:auto; | |
| border:1px solid #ccc; | |
| overflow-y:auto; | |
| padding:10px; | |
| background:white; | |
| } | |
| input{ | |
| width:300px; | |
| padding:10px; | |
| } | |
| button{ | |
| padding:10px; | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <h2>🎓 University Admission Chatbot</h2> | |
| <div id="chatbox"></div> | |
| <br> | |
| <input id="message" placeholder="Ask about admission..."> | |
| <button onclick="sendMessage()">Send</button> | |
| <script> | |
| function sendMessage(){ | |
| let message = document.getElementById("message").value; | |
| fetch("/chat",{ | |
| method:"POST", | |
| headers:{ | |
| "Content-Type":"application/json" | |
| }, | |
| body:JSON.stringify({message:message}) | |
| }) | |
| .then(res=>res.json()) | |
| .then(data=>{ | |
| let chatbox = document.getElementById("chatbox"); | |
| chatbox.innerHTML += "<p><b>You:</b> "+message+"</p>"; | |
| chatbox.innerHTML += "<p><b>Bot:</b> "+data.response+"</p>"; | |
| document.getElementById("message").value=""; | |
| }) | |
| } | |
| </script> | |
| </body> | |
| </html> |