CODEWITHSUNDEEP
javascriptjqueryhtmlcssgoogle-chrome
Bruno 82
Bruno 82

Reputation: 519

How to prevent the reset of form inputs when reloading a page in Chrome?

I'm building a web application which might (occasionally) reload the page in order to update some informations that are displayed on the page using Expression Language. In Firefox everything works fine, but in Chrome every time the page is reloaded all the content from the input fields is lost and the form is reset to blank. That is too annoying for the user, who has to type once again all the content that's gone lost. Is there any way to replicate in Chrome the same behaviour as Firefox with plain HTML, or is it necessary to use some Javascript? Thanks in advance.

Upvotes: 1

Views: 2330

Answers (2)

Mario Rawady
Mario Rawady

Reputation: 871

Lets say this is your code:

<form id="formId" action="" method="post">
    <input type="hidden" id="hiddenAction" name="hiddenAction" value="" />
    <input type="text" id="firstName" name="firstName" value="" />
</form>

If you are using a form, simply submit the form using JavaScriptinstead of refreshing the page.

If you can see that I added a hidden input at the beginning of the form. Used to track the submission action

$("#formId #hiddenAction").val("refreshed") ;
$("#formId").submit() ;

And then in your php at the beginning of the page put the following:

<?php
    $firstName = "" ;
    if (isset($_POST["hiddenAction"]) && $_POST["hiddenAction"] == "refreshed") { //When the hidden action is set to "refreshed" then we know that this is coming from refreshing the page
        $firstName = isset($_POST["firstName"]) ? $_POST["firstName"] : "" ; //Of course you have to escape the string and strip it from any pure html tags
    }
?>

And in your <html> code, change all your input tags respectively with their related values to match the below:

<input type="text" id="firstName" name="firstName" value="<?php echo $firstName ?>" />

Upvotes: 1

DerMakkuz
DerMakkuz

Reputation: 143

you have to use some little Javascript ..

Like saving Data in Cookie / Local Storage / etc...

Upvotes: 0

Related Questions