javascript - Socket.io is not defined -
whenever go http://localhost:8080/search
(search.html
), loads of html, reaches client-side javascript , crashes. first console.log
in searchclient.js
works, not second. error io not defined.
server.js:
var http = require('http'); var express = require('express'); var anydb = require('any-db'); var engines = require('consolidate'); var app = express(); var server = http.createserver(app); var io = require('socket.io').listen(server); var conn = anydb.createconnection('sqlite3://riverdata.db'); app.engine('html', engines.hogan); app.set('views', __dirname + '/templates'); app.use(express.static(__dirname + '/public')); app.get("/", function(request, response){ response.render('home.html'); }); app.get("/search", function(request, response){ response.render('search.html'); }); io.on('connection', function(socket){ socket.on('join', function(){ }); socket.on('search', function(toshowlist, conditionslist){ var data = conn.query('select toshowlist riverdata conditionslist'); console.log("im in socket.on(search)"); socket.emit('data', data); }); socket.on('disconnect', function(){ }); }); app.listen(8080);
searchclient.js:
console.log("begins"); var socket = io.connect(); console.log("keeps running"); window.addeventlistener('load', function(){ console.log("page loads"); var search = document.getelementbyid("searchbutton"); submit.addeventlistener("click", search, false); socket.emit('join'); socket.on('data', function(data){ console.log(data); }) }, false); function search(){ console.log("button clicked"); var toshowlist = []; var conditionslist = []; socket.emit('search', toshowlist, conditionslist); }
search.html:
<!doctype html public> <html lang="en"> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script> <script src='localhost:8080/socket.io/socket.io.js'></script> <script type="text/javascript" src="/searchclient.js"></script> <title>envirostats database</title> <link rel="stylesheet" href="/style.css" type="text/css" /> </head> <body class="search"> <form action=""> <input type="checkbox" name="data" value="data"> show date <br> <input type="checkbox" name="data" value="river"> show river <br> </form> <button id=searchbutton> search </button> </body> </html>
Comments
Post a Comment