I know this might be a simple question but I just didn't find the solution I want. I write a post route with express. like this:
app.post('/search', function(req, res){
// Some code to get data from req and save data to db
// Then want to stay current page.
});
My html:
<form action="/search" method="post">
<input value="name" name="marker[name]">
<input value="address" name="marker[address]">
<input value="rating" name="marker[rating]">
<button id="favo-button" type="submit">
Submit
</button>
</form>
When user click submit button, the data sent through req to the post route, and there insert to db. Then I want the page not direct to anywhere but stay current page. I tried some ways but not handle it very well. what I tried:
res.render('/search');
this makes the page re-render with the same view, but the page will flash because of the re-render.
app.post('/search', function(req, res){
var data = req.body.marker;
// some code insert data to db
// then do nothing to res. The page will stay but keep loading.
});
Is there a way to just do nothing to res
and stay, meanwhile not keep the page loading?
You could include a hidden iframe on your page and set the target attribute of your form to point to that iframe.
To keep the values, you must fill in the values on the server while rendering the page. Usually, you can simply copy the data from the HTML request parameters into the fields.
Express. js use different kinds of middleware functions in order to complete the different requests made by the client for e.g. client can make get, put, post, and delete requests these requests can easily handle by these middleware functions.
There are two ways to do this.
204 No Content
response. (app.post('/search', (req, res) => res.status(204).send());
)(You could also submit the form to a hidden iframe, but that's just an ugly hack).
You can do it in 2 ways:
1 - Do it using Jquery AJAX call, you need to write this code in your view page, not in controller or route of NODEJS App.
$("#YOUR_FORM_ID").on("submit", function () {
$.ajax({
url: '/search',
type: 'POST',
cache: false,
data: { $("#YOUR FORM ID").serialize() },
success: function (data) {
alert('Success!')
}
, error: function (jqXHR, textStatus, err) {
alert('text status ' + textStatus + ', err ' + err)
}
});
});
2 - By redirecting the request to the source request
app.post('/search', function(req, res){
//Do Something
res.redirect('/');//redirect to the page from where request came
});
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With