I am making a forum using Node, Express, EJS and MongoDB. Currently, I render the forum page and pass data from the database using Node and EJS. I use GET and POST requests. As soon as I add a comment, the page stores in the database and then redirects back to the same route. I am then able to scroll down and see my comment. However I am not happy with this and I want the comments and replies to be handled by Ajax so that as soon as I comment, without refreshing, I create a post request and again without refreshing the page I can load the new comment. Any suggestion on how can I bring this to live?
The project is available to view on https://github.com/Ibrahim40021974/Forum . (Sorry for the untidy code. Am still working on version control). All suggestions are welcomed! Thanks in Advance.
What you wanna achieve, is generally called a single page application where you won't see the page refresh but the small component of that page is actually got updated with new data.
I have done using Reactjs, Nodejs which is pretty easy to do in Reactjs. If you are interested , I can share the repo.
Had looked into your project and few things I noted.
e.preventDefault(). Default form submit always refresh the page which you don't want. Same form operation you have to do with ajax call.For exm.handleFormSubmit(e) {
e.preventDefault();
// <add your ajax call here>
}
See once you do this if things work without page refresh.