Reputation: 136
I am working on a Rails application and have a form that, upon submission, it to increase the window.history.length. I want the "Back" button to take the user back through all the history entries when clicked.
Here’s the structure of my code:
app/views/media/_form.html.slim
$( ".form" ).submit(function(event) {
$('.form').addClass('loading');
});
In the dashboard layout, I have a back button to allow users to navigate back through the history. Here's the JavaScript for that:
_app/views/share/v2/menu.html.slim
document.addEventListener('DOMContentLoaded', () => {
document.querySelector('.back-button').addEventListener('click', (event) => {
event.preventDefault();
window.history.back();
});
});
Problem: Each time the user edits the form, window.history.length increases by the number of times they submit the form (e.g., 2 or 3 times). As a result, the user has to click the back button 2 or 3 times to go back to the previous page.
Expected Behavior: When the user clicks the "Back" button, I want them to be taken directly to the previous page with one click, regardless of how many times the form was edited or submitted.
I have tried this
document.addEventListener('DOMContentLoaded', () => {
document.querySelector('.back-button').addEventListener('click', (event) => {
event.preventDefault();
var goback = window.history.length;
window.history.go(-goback);
});
back button not working, also tried
$( ".form" ).submit(function(event) {
$('.form').addClass('loading');
window.history.replaceState(null, null, window.location.href);
});
I have multiple forms in my Rails application (media, product, giveaway, league, etc.). I'm trying to use window.history.go(0) to reload the page after form submission. None work
. Is there a way to make it work? or any other solution to play around. Submit the form with ajax solve this issue. Because of complex form I can't do that.
Upvotes: 0
Views: 126