• Post Reply Bookmark Topic Watch Topic
  • New Topic
programming forums Java Mobile Certification Databases Caching Books Engineering Micro Controllers OS Languages Paradigms IDEs Build Tools Frameworks Application Servers Open Source This Site Careers Other Pie Elite all forums
this forum made possible by our volunteer staff, including ...
Marshals:
  • Campbell Ritchie
  • Jeanne Boyarsky
  • Ron McLeod
  • Paul Clapham
  • Liutauras Vilda
Sheriffs:
  • paul wheaton
  • Rob Spoor
  • Devaka Cooray
Saloon Keepers:
  • Stephan van Hulst
  • Tim Holloway
  • Carey Brown
  • Frits Walraven
  • Tim Moores
Bartenders:
  • Mikalai Zaikin

Text field not updating

 
Ranch Hand
Posts: 102
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
Hi guys,
I'm pretty sure this problem is not JSP related strictly, but I suppose this section is the most appropriate one, so ...
Basically, I have an input text field which is configured as readonly and I use to display some information. If I refresh the page, the content of the page is refreshed, while the content of the text field remains the same, which is kinda odd to me. What's happening ? How can I prevent the text field from retaining its content on page refresh ?
Thank you for your kind help, greatly appreciated as always.
 
Sheriff
Posts: 67746
173
Mac Mac OS X IntelliJ IDE jQuery TypeScript Java iOS
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator

Originally posted by Matteo Di Furia:
Basically, I have an input text field which is configured as readonly and I use to display some information. If I refresh the page, the content of the page is refreshed, while the content of the text field remains the same

Remains the same as what?

How can I prevent the text field from retaining its content on page refresh ?

How is the content being set in the first place?

You'll need to supply much more information or we can only guess.
 
Matteo Di Furia
Ranch Hand
Posts: 102
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
Well,
The text field is used in a picture gallery, at the beginning it displays the label "1 of 30" (30 is the number of pics, as an example). When the user click on the previous or next link, the image is loaded via Javascript and the textfield is updated accordingly.
Imagine the user visits the gallery page, by default it shows the 1st picture and the textfield displays "1 of 30" (in readonly mode). Suppose the user click the "next" link 7 times, then the page shows the 8th picture and the textfield displays "8 of 30" accordingly. At this point, if the user refresh the page, the page visualize the 1st picture, but the textfield still shows "8 of 30" (thus not loading the default HTML content).
Why this ?
 
author
Posts: 15385
6
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
well add a window.onload to your script and set the value of the textbox based on what the current number is.

Eric
 
Matteo Di Furia
Ranch Hand
Posts: 102
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
Mmm, sounds not viable since in a single page I can have more than one single gallery. Each gallery has an unique ID, but I can't know which ones are displayed on the page, hence a window.onload call to JavaScript function would not have the ID's of the displayed galleries.
Anyway, I suspect it must have a simpler, stupid solution just in front of my eyes, still can't see it.
 
Bear Bibeault
Sheriff
Posts: 67746
173
Mac Mac OS X IntelliJ IDE jQuery TypeScript Java iOS
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
Are you seeing this behavior in all browsers?
 
Matteo Di Furia
Ranch Hand
Posts: 102
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
Well, on IE and FireFox for sure. I think I'm going to force somehow the reload of the text field value, only have to elaborate how
 
Bear Bibeault
Sheriff
Posts: 67746
173
Mac Mac OS X IntelliJ IDE jQuery TypeScript Java iOS
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
Just to be sure that we're all on the same page:

1) The intial value of the field is set with a value attribute on the input.

2) During the course of the page's lifetime, the value is changed under script control

3) A refresh shows the value set by (2) rather that than by (1)
 
Matteo Di Furia
Ranch Hand
Posts: 102
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
Thats' exact !

And just to be even more clear:

HTML source :



The page holds a JavaScript variable (currentPicIndex) inizialized with value "1" and which contains the current pic number. When the user clicks on "next" link, the variable gets the new index, the relative image is loaded and the element is updated with:



Refreshing the page brings back the 1st pick (like the HTML code states), but the input text still have the last set value.
[ July 21, 2008: Message edited by: Matteo Di Furia ]
 
Matteo Di Furia
Ranch Hand
Posts: 102
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
I've written a simple short piece of code, you can try it on your own.



Please note that when refreshing the page, the content of the input text does not change, but pressing the Go button will show a value of "2" (hence the variable gets actually restored to initial value 1).

P.S. I wrote "on Click" on purpose since I was getting an error while posting it as "onClick"
My page is basically the same as this.
[ July 21, 2008: Message edited by: Matteo Di Furia ]
 
Bear Bibeault
Sheriff
Posts: 67746
173
Mac Mac OS X IntelliJ IDE jQuery TypeScript Java iOS
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator

Originally posted by Matteo Di Furia:
HTML source :

Not quite. That's JSP source. The HTML source will have the scriptlet expressions replaced.

But, believe it or not, that's a "feature" of some of the browsers. I wrote a little test page that demonstrates the behavior:

Firefox and IE6 will retain the form field values on a refresh. I suppose that was intended to be friendly and make sure that the user didn't lose input data if they accidentally hit refresh.

Safari and Opera do not exhibit this behavior.

If the page is refreshed from the address bar, the fields revert to original values. The retention in Firefox and IE (haven't tested IE7, but assume it behaves the same way as IE6) only happens when the page is refreshed by the toolbar button or key-stroke (F5).

If you want to circumvent this behavior, you may have to resort to explicitly setting the value in the onload handler.
[ July 21, 2008: Message edited by: Bear Bibeault ]
 
Matteo Di Furia
Ranch Hand
Posts: 102
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
Mmm, I was also thinking this is the default behaviour, just to be more friendly to user, as you said. Perhaps it is the right way to go, it's the programmer's duty to make the greater efforts to make the things work, not the user's.
Well, ok, I'll invent something to circumvent this. Unfortunately, the onload event is not suitable for this problem, since a page can present more than one gallery, pluggable via a template or in some other way.
Maybe I'll switch the INPUT text element with something else I can programmatically update the content which.
Thank you all for the kind support.
Regards.
 
Bear Bibeault
Sheriff
Posts: 67746
173
Mac Mac OS X IntelliJ IDE jQuery TypeScript Java iOS
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
If the input element is only being used for display, why bother with an input? Use a <span> instead.
 
Matteo Di Furia
Ranch Hand
Posts: 102
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
Can you change the span content via JavaScript ? I mean avoiding the innerHTML properties, which is not cross-browsers valid if I recall correctly.
Some other way to modify a <SPAN> tag content ? Consider that the page is not reloaded to browse the gallery, JavaScript handles the image loading when the user click on the previous and next links.
 
Bear Bibeault
Sheriff
Posts: 67746
173
Mac Mac OS X IntelliJ IDE jQuery TypeScript Java iOS
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator

Originally posted by Matteo Di Furia:
Can you change the span content via JavaScript?

Yes,

I mean avoiding the innerHTML properties, which is not cross-browsers valid if I recall correctly.

innerHTML works in all major browsers. If you're squeamish, you can do it with DOM manipulation methods as well.

Or let a JS library such as jQuery handle the details.
 
Matteo Di Furia
Ranch Hand
Posts: 102
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
OK, I'll try innerHTML then. Other tools could of course solve the problem, but it seems to me I'd be shooting a fly with a cannon to configure and involve such tools just to update a label.
I'll go with innerHTML and test it then.
Thank you again Bear Bibeault.
 
Consider Paul's rocket mass heater.
reply
    Bookmark Topic Watch Topic
  • New Topic