app.js
var express = require('express');
var path = require('path');
var favicon = require('serve-favicon');
var logger = require('morgan');
var cookieParser = require('cookie-parser');
var bodyParser = require('body-parser');
var request = require('request');
var app = express();
// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');
app.use(favicon(path.join(__dirname, 'public', 'favicon.ico')));
app.use(logger('dev'));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));
//Books Data---------------------------------------------------
var newBooks = [
{
img: 'Eragon.png',
title: 'Eragon',
author: 'Christopher Paolini',
genre: 'Fantasy',
published: 2002},
{
img: 'Eldest.png',
title: 'Eldest',
author: 'Christopher Paolini',
genre: 'Fantasy',
published: 2005},
{
img: 'Brisingr.png',
title: 'Brisingr',
author: 'Christopher Paolini',
genre: 'Fantasy',
published: 2008},
{
img: 'Inheritance.JPG',
title: 'Inheritance',
author: 'Christopher Paolini',
genre: 'Fantasy',
published: 2011},
{
img: 'Harry_Potter_and_the_Philosophers_Stone.jpg',
title: "Harry Potter and the Philosopher's Stone",
author: 'J.K. Rowling',
genre: 'Fantasy',
published: 1997},
{
img: 'Harry_Potter_and_the_Chamber_of_Secrets.jpg',
title: 'Harry Potter and the Chamber of Secrets',
author: 'J.K. Rowling',
genre: 'Fantasy',
published: 1998},
]
//-------------------------------------------------------------
//Routes-------------------------------------------------------
app.get('/', function(req, res, next) {
res.render('index', { title: 'Express', books: newBooks})
});
app.post('/signout', function(req, res, next){ //<---- The problem route
var title= req.body.book.title;
console.log(title);
});
app.get('/searching', function(req, res, next){
var val = req.query.search;
var searchData = [];
if(val.length > 0){
for(var i = 0; i < newBooks.length; i++){
if(newBooks[i].title.toUpperCase().includes(val.toUpperCase()))
searchData.push(newBooks[i]);
}
}
res.json(searchData);
});
//-------------------------------------------------------------
// catch 404 and forward to error handler
app.use(function(req, res, next) {
var err = new Error('Not Found');
err.status = 404;
next(err);
});
// error handler
app.use(function(err, req, res, next) {
// set locals, only providing error in development
res.locals.message = err.message;
res.locals.error = req.app.get('env') === 'development' ? err : {};
// render the error page
res.status(err.status || 500);
res.render('error');
});
app.listen(3000, function(){
console.log('App is listening on port 3000!');
})
module.exports = app;
main.js
$(function(){
$('.searchBar').on('keyup', function(e){
// if(e.keyCode === 13){
var parameters = { search: $(this).val()};
$.get('/searching', parameters, function(data){
var $stuff = $('<section class="bookSection"><h4 style="text-align: center">Search Results:</h4><br></section>');
if(data.length > 0){
for(var i = 0;i < data.length; i++){
$stuff.append('<div><span><img src="'+data[i].img+'"></span><hr><span class="title">'+data[i].title+'</span><hr><span class="author">'+data[i].author+'</span><hr><span>'+data[i].genre+'</span><hr><span>'+data[i].published+'</span></div>');
}
} else {
$stuff.append('<h2 style="text-align: center">No results available, sorry!</h2>');
}
$('#results').html($stuff);
});
// };
});
});
$(function(){
$('.bookSection div').on('click', function(e){
var book = {
title: $(this).find('.title').text(),
author: $(this).find('.author').text()
}
if(window.confirm('Would you like to sign out '+book.title+' by '+book.author+'?') == true){
$.post('/signout', book, function(){ //<--------------- the problem post
alert(book.title+' signed out.');;
});
}
});
});
Now, the issue. I am basically trying to make it so that when a user clicks on a book, a window will pop up that asks them if they would like to sign it out. When they click okay, the book information is supposed to be sent to the '/signout' route in app.js. However, all I receive is a 404, despite having another very similar function for a '.get' route in main.js as well. Could anyone please tell me what is going on in regards to why the route is not being accessed when the other two routes I have are perfectly fine?
via TheWhalePhail
No comments:
Post a Comment