I have these in my layout.ejs
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
My main.js file
$(document).ready(function() {
$('.delete-article').on('click', function(e) {
$target = $(e.target);
const id = $target.atrr('data-id');
$.ajax({
type: 'DELETE',
url: '/post/'+id,
success: function(response) {
alert('Deleting Post');
window.location.href='/';
},
error: function(err){
console.log(err);
}
})
})
})
and these is my delete link
<a class="delete-article" href="#" data-id="{item._id}">Delete</a>
I have installed jQuery
npm install jquery
index.js file
router.delete( '/post/:id', function( req, res ){
let query = {_id:req.params.id}
Post.remove(query, function(err) {
if(err){
console.log(err);
}
res.send('Success');
});
});
I am getting the error main.js:1 Uncaught ReferenceError: $ is not defined
whenever I refresh my browser without even clicking on delete link.
I know this is a problem from jQuery but I decided to post all my codes to make it easier for someone to help. I started learning Nodejs and Express one month ago.