[Webinar] Streamline your web hosting managementRegister Today

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 421
  • Last Modified:

Radio button state not persisted in IE on some...

I have two radio buttons. Based on the radio button selection, I need to enable the specific div
Each of the divs has links to show some data. On clicking of first radio button, the div enabled has some links to show data in popup window. But in the second div, the links show data in the same parent window itself.

Procedure: First div link data is clicked and the popup window is displayed. Close the window
Click on the second radio button. Click on the link for data and the data is seen. Click on IE back. The first radio button is selected and not the second one.

Instead of viewing the the first div data, if the 2nd radio button data is viewed and IE back is clicked, the second radio button is selected.

Problem is with the first case.

This works fine with other browsers.

Please let me know is there some problem with some request context getting changed ? How to solve this problem?
0
kssreelakshmi
Asked:
kssreelakshmi
  • 13
  • 10
1 Solution
 
Michel PlungjanIT ExpertCommented:
Show the code...

IF the page is reloaded you might want to save the state in a hidden field or a cookie
0
 
kssreelakshmiAuthor Commented:
The page is reloaded only in case of second option. But the problem is when i use first and second option in a sequence of operations. I cannot share the code
0
 
Michel PlungjanIT ExpertCommented:
Show a cleaned example that exhibits the problem
0
Never miss a deadline with monday.com

The revolutionary project management tool is here!   Plan visually with a single glance and make sure your projects get done.

 
kssreelakshmiAuthor Commented:
Radio 1                                                       Radio 2
   Link 11                                                     Link 21
   Link 12                                                     Link 22

Link 1* opens in popup window
Link 2* opens in the same parent window

Hope this layout can help you..
Beyond this I shall not be able to add the code

0
 
Michel PlungjanIT ExpertCommented:
So I shall....

This works for me in IE6 on win2k
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
  <title></title>
<script>
function toggleDivs(show,hide) {
  document.getElementById("div"+show).style.display='';
  document.getElementById("div"+hide).style.display='none';
}
function openWin(link) {
  var w = window.open(link.href,link.target,"width=500,height=500")
  return (w)?false:true; // handle popup blockers
}
</script>  
  </head>
  <body>
<form>  
 
<input type="radio" name="r1 "onClick="toggleDivs(1,2)">Radio 1
<div id="div1" style="display:none"><a href="http://www.google.com/search?q=popup" target="googleWin" onClick="return openWin(this)">Link 1* opens in popup window</a></div>
<input type="radio" name="r1 "onClick="toggleDivs(2,1)">Radio 2
<div id="div2" style="display:none"><a href="http://www.google.com/search?q=same+window">Link 2* opens in the same parent window</a></div>
  </body>
</html>

Open in new window

0
 
kssreelakshmiAuthor Commented:
Your code is very similar to what I have done.
But this also still has the same problem what I had.
First select the Radio 1. Click on the link for Popup window.
Then select the Radio 2. Click on the link for same page
Once the page is loaded in the same location, click on the back of IE.
None of the radio buttons are in checked state.

But if u try individually the Radio 2, it works

0
 
Michel PlungjanIT ExpertCommented:
I cannot reproduce it.
The radio 2 is selected when I go back

What is the browser version and platform you are using?
0
 
kssreelakshmiAuthor Commented:
Win XP and IE 6
0
 
kssreelakshmiAuthor Commented:
On JBOSS web server
0
 
Michel PlungjanIT ExpertCommented:
I am sorry. I do not have that setup. IE6 on Win2K works as advertised.
I have IE7 on XP at home...
0
 
kssreelakshmiAuthor Commented:
I tried your code and mine in IE 6 and Win2K as you mentioned. Even there it is the same behavior. Problem still exists
0
 
kssreelakshmiAuthor Commented:
Even on IE 7 Win XP this does not work
0
 
Michel PlungjanIT ExpertCommented:
Very curious...

Try this

http://www.plungjan.name/ee/reload.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
  <title></title>
<script>
function toggleDivs(show,hide) {
  document.getElementById("div"+show).style.display='';
  document.getElementById("div"+hide).style.display='none';
}
function openWin(link) {
  var w = window.open(link.href,link.target,"width=500,height=500")
  return (w)?false:true; // handle popup blockers
}
</script>  
  </head>
  <body>
<form>  
<input type="hidden" name="whichRad" value="">
<input type="radio" value="rad0" name="r1" onClick="toggleDivs(1,2);document.cookie='r1-0'">Radio 1
<div id="div1" style="display:none"><a href="http://www.google.com/search?q=popup" target="googleWin" onClick="return openWin(this)">Link 1* opens in popup window</a></div>
<input type="radio" value="rad1" name="r1" onClick="toggleDivs(2,1);document.cookie='r1-1'">Radio 2
<div id="div2" style="display:none"><a href="http://www.google.com/search?q=same+window">Link 2* opens in the same parent window</a></div>
</form>
<script>
if (document.cookie.indexOf('r1-1') !=-1) {
  document.forms[0].elements['r1'][1].click();
}  
</script>
  </body>
</html>

Open in new window

0
 
kssreelakshmiAuthor Commented:
Hey this is working.
I also thought of using the Cookies, but if the end user disables cookies, this will be a problem.
Also another option is frames. But my application does not use frames.

Only other option left is to use the Query string. Send the selected type from my page
0
 
Michel PlungjanIT ExpertCommented:
Like this you mean

http://www.plungjan.name/ee/reload_hash.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
  <title></title>
<script>
function toggleDivs(show,hide) {
  document.getElementById("div"+show).style.display='';
  document.getElementById("div"+hide).style.display='none';
}
function openWin(link) {
  var w = window.open(link.href,link.target,"width=500,height=500")
  return (w)?false:true; // handle popup blockers
}
</script>  
  </head>
  <body>
<form>  
<input type="hidden" name="whichRad" value="">
<input type="radio" value="rad0" name="r1" onClick="toggleDivs(1,2);location.hash='r1-0'">Radio 1
<div id="div1" style="display:none"><a href="http://www.google.com/search?q=popup" target="googleWin" onClick="return openWin(this)">Link 1* opens in popup window</a></div>
<input type="radio" value="rad1" name="r1" onClick="toggleDivs(2,1);location.hash='r1-1'">Radio 2
<div id="div2" style="display:none"><a href="http://www.google.com/search?q=same+window">Link 2* opens in the same parent window</a></div>
</form>
<script>
if (location.hash.indexOf('r1-1') !=-1) {
  document.forms[0].elements['r1'][1].click();
}  
</script>
  </body>
</html>

Open in new window

0
 
kssreelakshmiAuthor Commented:
What is this hash? Hearing it for the first time :-(
But this is working !!
Let me put this into my logic and check
0
 
Michel PlungjanIT ExpertCommented:
Hash is the name for the # (pound/gate) sign and is used to go to named anchors:


<a href="#bottom">Go to bottom</a>
.
.
.
.
.
<a name="bottom">Here is the bottom</a>

and it will add to the page url:

page.html#bottom

but we can steal this feature in javascript to allow navigation of for example ajaxed content
0
 
kssreelakshmiAuthor Commented:
Thanks a lot for the solution. It is working in my application too.
0
 
kssreelakshmiAuthor Commented:
Could you please tell me the reason for the problem ?
0
 
Michel PlungjanIT ExpertCommented:
I have no idea. IE works on one pc and not on the other. Could be how you cache the page or how the server sends cache parameters
0
 
kssreelakshmiAuthor Commented:
If this code snippet is present in HTML file, works fine. But if embedded in a JSP, this has issues
0
 
Michel PlungjanIT ExpertCommented:
What issues?
0
 
kssreelakshmiAuthor Commented:
The first snippet of code you shared works fine if present in HTML but if in JSP it does not.

But the hash solution shared works for both HTML and JSP alike
0

Featured Post

[Webinar] Kill tickets & tabs using PowerShell

Are you tired of cycling through the same browser tabs everyday to close the same repetitive tickets? In this webinar JumpCloud will show how you can leverage RESTful APIs to build your own PowerShell modules to kill tickets & tabs using the PowerShell command Invoke-RestMethod.

  • 13
  • 10
Tackle projects and never again get stuck behind a technical roadblock.
Join Now