Welcome to WebmasterWorld Guest from 54.166.172.33

Forum Moderators: incrediBILL

Message Too Old, No Replies

Hidden input when refreshed (F5)

     
9:48 pm on Sep 2, 2007 (gmt 0)

New User

10+ Year Member

joined:Aug 22, 2007
posts:10
votes: 0


I have a page where I use multiple hidden inputs:

<input id="i21" name="c21" type="hidden" value=0 />
<input id="i22" name="c22" type="hidden" value=0 />
<input id="i23" name="c23" type="hidden" value=0 />
etc...

It works just as expected. However when a user refreshes the page using F5, the hidden values will not return back to 0. It will stay set at whatever it was previously.

Am I doing something wrong, or is there a way to force the values back to 0 when refreshed?

2:22 am on Sept 3, 2007 (gmt 0)

Senior Member

WebmasterWorld Senior Member penders is a WebmasterWorld Top Contributor of All Time 10+ Year Member Top Contributors Of The Month

joined:July 3, 2006
posts: 3123
votes: 0


Presumably you are changing this (hidden) value using JavaScript after the page has loaded? And it is this value that is sticking after a page refresh?

I think you'll find that it is not just the hidden fields. It seems to be normal browser behaviour in both IE6 and FF for ALL form fields (visible and hidden) to retain their values between page refreshes (F5). Unless the user hits Ctrl+F5, in which case the page is forced to be downloaded a fresh and the form values are reset.

You can of course initialise these values as the page loads and so 'resetting' any cached value. This may be the way to proceed?

Which browser(s) are you testing?

I don't believe this is an issue with Opera, as the form values appear to be reset on a regular page refresh.

12:57 pm on Sept 3, 2007 (gmt 0)

New User

10+ Year Member

joined:Aug 22, 2007
posts:10
votes: 0


Yes I'm changing these values using Javascript after the page loads and I'm testing in FF and IE7.

What do you mean by initializing the values when the page loads?

1:10 pm on Sept 3, 2007 (gmt 0)

Senior Member from US 

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month

joined:Sept 4, 2001
posts:2246
votes: 49


Adding to the javascript something like:

function reset() {
document.FORMNAME.FORMFIELDNAME.value="";
document.FORMNAME.FORMFIELDNAME.value="";
document.FORMNAME.FORMFIELDNAME.value="";
}

I believe might help. Adjust the upper case items to fit your form.

Marshall

1:53 pm on Sept 3, 2007 (gmt 0)

New User

10+ Year Member

joined:Aug 22, 2007
posts:10
votes: 0


That wouldn't be such a good idea on my page.

I could have coded the entire page using Javascript variables instead of hidden inputs, but I had to hide some of my code using PHP in order to prevent some people from just viewing the source and copy+pasting it all.

I have around 800 hidden inputs on a single page, so doing some sort of FOR loop in a Javascript function will make the page load extremely slow. I already have a "Clear All" button that does the exact same thing, and it loads extremely slow on IE7.

Since I'm new here, I don't know the exact rules for this forum regarding whether I can post links to the page I'm talking about to give you a better idea of what I'm doing. But basically my page contains a table with about 800 cells, each with its own input.

2:41 pm on Sept 3, 2007 (gmt 0)

Senior Member from US 

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month

joined:Sept 4, 2001
posts:2246
votes: 49


nivlam,

No, you are not allowed to post url's and php is not my forte. But I am curious, why "800 hidden inputs" on any page?

Marshall

2:45 pm on Sept 3, 2007 (gmt 0)

New User

10+ Year Member

joined:Aug 22, 2007
posts:10
votes: 0


Imagine an Excel type page, except that each cell contains a button. When the button is pressed, the hidden input's "bit" is flag set to 1 instead of 0. If the button is pressed again, it's reset back to 0.

It's kind of hard to explain, but people who use it seem to like the concept.

If there is a better solution to pass the status of each button to PHP, then I don't know it.

6:27 pm on Sept 3, 2007 (gmt 0)

Senior Member

WebmasterWorld Senior Member penders is a WebmasterWorld Top Contributor of All Time 10+ Year Member Top Contributors Of The Month

joined:July 3, 2006
posts:3123
votes: 0


If there is a better solution to pass the status of each button to PHP, then I don't know it.

Use checkboxes instead of buttons...?

7:01 pm on Sept 3, 2007 (gmt 0)

New User

10+ Year Member

joined:Aug 22, 2007
posts:10
votes: 0


That could be a more efficient possibility, however with the current page layout, it would be extremely hard to read with all the check boxes.

The 800+ inputs don't seem to pose a problem at the moment, seeing as the page loads and render fast.

But back to the original problem: Does anyone know a way to reset the hidden input values when the page is refreshed using F5? Looping through each input field is out of the question. I could always write a note on the page telling visitors to do [Ctrl+F5], but I'd rather make it easy for them and find a solution.

7:47 am on Sept 4, 2007 (gmt 0)

Senior Member

WebmasterWorld Senior Member penders is a WebmasterWorld Top Contributor of All Time 10+ Year Member Top Contributors Of The Month

joined:July 3, 2006
posts:3123
votes: 0


Looping through each input field is out of the question.

Have you tried it? I think you are underestimating the power of JS. I just tried 'resetting' 800 hidden fields using JS and it took 0.1 secs (on my P4 3.4 GHz). The bottleneck (if any) is not the JS, but the size of the page and the download time over a slow connection.

The code I used...


window.onload = reset_hidden;

function reset_hidden() {
var el = document.getElementsByTagName('input');
for (var i=0; i<el.length; i++) {
if (el[i].getAttribute('type') == 'hidden') { el[i].value = 0; }
}
}

This will set the value of all hidden input elements to 0 when the page loads. Obviously you may have to tweak this if you have other hidden input's for other purposes.

11:39 am on Sept 4, 2007 (gmt 0)

New User

10+ Year Member

joined:Aug 22, 2007
posts:10
votes: 0


Seems like that is the only solution at the moment.

However, you have to remember that I have a button associated with each hidden input, therefore using your method, we would be looping through 800 * 2 inputs since they are both tag name 'input'.

I just tested this out and it loads in 0.25 seconds using Firefox. However for IE7, it takes over 2 seconds. Would you feel comfortable adding 2 seconds to your page's loading time?

But I guess I'll have to live with it for now.

1:35 pm on Sept 4, 2007 (gmt 0)

Senior Member

WebmasterWorld Senior Member penders is a WebmasterWorld Top Contributor of All Time 10+ Year Member Top Contributors Of The Month

joined:July 3, 2006
posts: 3123
votes: 0


However, you have to remember that I have a button associated with each hidden input, therefore using your method, we would be looping through 800 * 2 inputs since they are both tag name 'input'.

In my example I did test it on a form with 800 buttons and hidden elements, so yes it was stepping through 1600 elements.

I just tested this out and it loads in 0.25 seconds using Firefox. However for IE7, it takes over 2 seconds. Would you feel comfortable adding 2 seconds to your page's loading time?

Admittedly I had only tried it in FF. IMHO, an extra 2 seconds on the page load time would be acceptable under the circumstances. How long is your page currently taking to download, without the form reset?

Another option might be to disable the page cache, but I think that would impact your page load time a lot more!

9:52 pm on Sept 4, 2007 (gmt 0)

New User

10+ Year Member

joined:Aug 22, 2007
posts:10
votes: 0


How long is your page currently taking to download, without the form reset?

Right now the page is about 150kb in size and loads pretty much instantly on a broadband connection ( <0.5 seconds ).

2 seconds is a lot to me, thats why I'm so hesitant to use that Javascript loop.

I tried to disable page caching, but it didn't work.

11:40 pm on Sept 4, 2007 (gmt 0)

Senior Member

WebmasterWorld Senior Member penders is a WebmasterWorld Top Contributor of All Time 10+ Year Member Top Contributors Of The Month

joined:July 3, 2006
posts: 3123
votes: 0


Out of curiosity, just some stats to perhaps ease your mind a tad... when running just the above JavaScript on different browsers and three different machines, the timings I find are:

>> P4, 3.4Ghz, 1GB, WinXP SP2
FF1.5 - 0.11 secs
IE6 - 0.74 secs
Op8 - 0.02 secs

>> T5300, 1.73Ghz, 2GB, Vista
FF2 - 0.08 secs
IE7 - 0.59 secs
Op9 - 0.02 secs

>> P2, 300Mhz, 224MB, Win98 (worst case)
FF1 - 1.05 secs
IE5 - 30.82 secs!
Op7 - 5.05 secs

FF and Op are certainly the winners in this test... IE5 is just of historic interest (good grief)!