This has been requested so I’ll share some JavaScript code you can use below.
But first, you’ll need to find your component ID.
Change the component_ID in the code to your forms component ID.
TB.render('component_ID', function(data) {
data.ele.find('.af-form-submit').on('click',function(){
location.reload();
});
});
Hey @Chem,
I’m using this code on a page and I have additional Javascript that hides the component if a criterion is met but when I submit the form and the page refreshes it doesn’t refresh the Javascript that is supposed to hide the component. If I hit the browser refresh button the component hides as intended.
Am I missing something here?
This is awesome, thanks @Chem!
Works great if you are uploading a file. It’ll update all text fields but not a file / attachment field. How can we refresh after form has submitted files as well. I’d be ok redirecting to the same page or using a custom URL but they do not reload the page if you specify the same page.
Hi avralex,
I was able to use this script:
TB.render('component_ID', function(data) {
data.ele.find('.td-data-link').on('click',function(){
location.reload();
});
});
Just manage to change the component_ID
This is great for form submissions without error. However, when a form is submitted with an error, the page reloads too fast to see the error. It looks like the form was submitted successfully. Would it be possible to make a “pause” before the reload?
I tried to add this:
setTimeout(function () {
location.reload(true); //MODIFICATION
}, 5000);
But then the page kept reloading every 5 seconds…
How should I do it correctly?
Hey @ivan,
you can use the following code
function wait(ms){
var start = new Date().getTime();
var end = start;
while(end < start + ms) {
end = new Date().getTime();
}
}
TB.render('component_ID', function(data) {
data.ele.find('.af-form-submit').on('click',function(){
wait(5000);
location.reload();
});
});
The code:
TB.render('component_6', function(data) {
data.ele.find('.td-data-link').on('click',function(){
location.reload();
});
});
Seems to break the page for me. I’m trying to use this on a data table action button. After adding the javascript the page refuses to load.
Hey @Chem
Your code using the wait function worked marvelously, but the user never sees the whether the form was successfully saved. Is there a way to reload only if the form submission was successful?
This might apply. Look at the last post. Add a close modal/popup option with the submit rules.
Hi Tadabase - I am new to javascript. I am able to refresh the entire page upon form submission and clicking an action link. However, I am not able to do so with the Task Button. Is there a special trick besides changing the component ID? Thank you
Hey Chem, I know this functionality is a plugin now but I was wondering if you could help me an oversite in the plugin.
Currently, if you use the “Form Submission Page Refresh” plugin it works quite well until there is a required field on the form that wasn’t filled out and the form is a table popup form. The result is the form doesn’t submit and the page refreshes which leads the user to believe it was submitted.
Is there a way to add some code to the form refresh that checks if the validation alert has been triggered and if it has, don’t refresh the page?