Geek Answers Handbook

Request to send jQuery Ajax using node.js and expression

I tried to send an AJAX request with jQuery to my Node.JS server in Node.JS and Express, but it does not work!

var express = require('express') var app = express(); app.listen(8888); app.configure(function(){ app.use(express.bodyParser()); app.set('views',__dirname + '/views'); app.set('view engine', 'ejs'); app.use(express.static(__dirname + '/public')); app.use(express.cookieParser()); app.use(app.router); }); app.get('/', function (req, res){ res.render('ajax.ejs'); }); app.post('/ajax', express.bodyParser(), function (req, res){ console.log(req); console.log('req received'); res.redirect('/'); });

And this is ajax.ejs :

 <html> <head> <script src="http://code.jquery.com/jquery-1.6.2.min.js"></script> <script type="text/javascript"> $('#enter').click(function(){ $.ajax({ url: '/ajax', type: 'POST', cache: false, data: { field1: 1, field2: 2 }, success: function(data){ alert('Success!') } , error: function(jqXHR, textStatus, err){ alert('text status '+textStatus+', err '+err) } }) }); </script> </head> <body> <form> <input type="button" id="enter" value="Enter"> </form> </body> </html>

When ajax.ejs loads, there is no output in the console, so the mail request did not work. What can I do?

Thanks in advance!

+6
source share
2 answers

I found your problem. You need to move your script from the head to your body (after the form tag):

 ... </form> <script type="text/javascript"> $('#enter').click(function(){ ... </script> </body>
+6
source

The code below works according to new releases.

server.js

 var express = require('express') var app = express(); var bodyparser = require('body-parser'); var urlencodedparser = bodyparser.urlencoded({extended:false}) app.set('views',__dirname + '/views'); app.set('view engine', 'ejs'); app.use(express.static(__dirname + '/public')); app.use(express.cookieParser()); app.get('/', function (req, res){ res.render('ajax.ejs'); }); app.post('/ajax', urlencodedparser, function (req, res){ console.log(req); console.log('req received'); res.redirect('/'); }); app.listen(8888);

ajax.ejs

 <html> <head> <script src="http://code.jquery.com/jquery-1.6.2.min.js"></script> </head> <body> <form> <input type="button" id="enter" value="Enter"> <script type="text/javascript"> $('#enter').click(function(){ $.ajax({ url: '/ajax', type: 'POST', cache: false, data: { field1: 1, field2: 2 }, success: function(data){ alert('Success!') } , error: function(jqXHR, textStatus, err){ alert('text status '+textStatus+', err '+err) } }) }); </script> </form> </body> </html>
+1
source

More articles:


All Articles