Save id from URL to USER.REQ without refreshing the page

Hi everyone!

I am building a “campground-rating” express app through NodeJS. So far things look really good. I’ve got full CRUD functionality on adding campgrounds, deleting them, adding reviews, authentication etc.

I’m using ejs templating to display the different campgrounds from my MongoDB.

So here’s the issue. I wanted to add an add-to-favorite button that would push the current camping id. (found in de URL) to the current user (req.user), WITHOUT refreshing the page. I’ve managed to do this the normal way with refreshing the page through a normal express request.

I understood that this is where AJAX comes into play. I tried using Fetch() but I can’t seem to understand how to extract the camping.id from the URL in the JS file with fetch and then posting the body data to my express API and then save it to my req.user in the Database without refreshing the page. Is this even possible?

I just can’t seem to find out how to make express, ejs and fetch() work together in this way. It’s been really frustrating and I’m really desperate for some help. I already did the AJAX FCC tutorial but it didn’t touch this subject. Please let me know if my question is clear enough. Help is much appreciated.

Thank you,

Roland

Hello there,

It might be easier to help, if you do not mind sharing your code. A CodeSandbox, Repl, Glitch, or simply GitHub repo link would be helpful.

Otherwise, it sounds like a simple issue of the default behaviour for HTML forms/buttons submitting information. In which case, the solution is to, within your client-side js add:

function onAddToFavourites(event) {
  event.preventDefault();
  // Rest of logic
}

Hope this helps

1 Like

Thanks for your reply. The problem was a minorbug with the Mongoose Schema in the end. It couldn’t push into it cause the Schema was not coded right.