<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/2.3.0/socket.io.js"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
        document.addEventListener('DOMContentLoaded', () => {
            var socket = io.connect(location.protocol + '//' + document.domain + ':' + location.port);
            socket.on('connect', () => {
                    const selection = document.querySelector('#text').value;
                    socket.emit('submit value', {'selection':selection});
            socket.on('submit text', data => {
                const li = document.createElement('li');
                li.innerHTML = `msg: ${data.selection}`;
    <title>chat room</title>
    <h1 style="font-family:verdana; font-style:italic;">Chat room!!!</h1>
    <ul id="list">
    <form id="chat">
        <input id="text" autocomplete="off" autofocus placeholder="enter text">
        <input type="submit">

python code :

import os

from flask import Flask, render_template
from flask_socketio import SocketIO, emit

app = Flask(__name__)
app.config["SECRET_KEY"] = os.getenv("SECRET_KEY")
socketio = SocketIO(app)

def index():
    return render_template("index.html")

@socketio.on("submit value")
def chatting(data):
    emit("submit text", {"selection":selection}, broadcast=True)

this is my whole code. When I submit my form nothing happens, I don't get any output. It Seems my entered text is didn't go to the server. Please help me solve this issue. Thank you.

  • Have you tried putting the <script> at the bottom of the HTML page (right before </body>? The HTML has to load first before JS can grab any values.
    – azb1297
    May 4 '20 at 18:09
  • Thanks for your efforts @azb1297, but the problem is solved. Actually there was no handler for the form and so it was not working. So thank you.
    – stormcloak
    May 5 '20 at 6:15

You must log in to answer this question.

Browse other questions tagged .