?
Solved

Javascript Back Button Issue in PHP

Posted on 2011-10-09
8
Medium Priority
?
231 Views
Last Modified: 2012-06-21
I have a search page here (TinyURL used to avoid google indexing):

http://tinyurl.com/6y5gqfd

By default the form action is this:
<form action="residential?frame=RESI&base=frames" method="post" name="byCity" id="byCity">

Open in new window


Under Step 2, I have the following form action onClick event.

<input type="radio" name="proptype" id="RESI" value="RESI" checked="checked" onClick="this.form.action='residential?frame=RESI&base=frames';" />

Open in new window


This works great EXCEPT when the user performs a search and then click the Back button in their browser to return to the search page.

When they do this, the form shows the Radio select in Step 2 is still selected but in reality it defaults to the default form action in Firefox.  I assume its the same for other browsers.

Is there a javascript I can insert to make sure it maintains the onClick action when back is clicked?

Please provide a sample to try.

0
Comment
Question by:pda4me
  • 4
  • 4
8 Comments
 
LVL 6

Expert Comment

by:bartvd
ID: 36938694
<body onload="document.getElementsById('RESI').checked=true;" > 

This ensures your first radio button is selected, also when you go back.
0
 

Author Comment

by:pda4me
ID: 36938698
bart,

I just realized, should have included the whole group in step 2.  Their id is not always RESI?  How do I update your code to do this?  Also, is it possible to have this as a javascript and not attached to the <body> tag?

                  
	<label>
					<input type="radio" name="proptype" id="RESI" value="RESI" checked="checked" onClick="this.form.action='residential?frame=RESI&base=frames';" />
					Residential</label>
				<label>
					<input type="radio" name="proptype" id="LOTL" value="LOTL" onClick="this.form.action='residential?frame=LOTL&base=frames';" />
					Land and Lots</label>
				<label>
					<input type="radio" name="proptype" id="COMI" value="COMI" onClick="this.form.action='residential?frame=COMI&base=frames';" />
					Commercial</label>
				<label>
					<input type="radio" name="proptype" id="INCP" value="INCP" onClick="this.form.action='residential?frame=INCP&base=frames';" />
					Income Producing</label>
				<label>
					<input type="radio" name="proptype" id="RNTL" value="RNTL" onClick="this.form.action='residential?frame=RNTL&base=frames';" />
					Rentals</label>

Open in new window

0
 
LVL 6

Expert Comment

by:bartvd
ID: 36938717
There are two choises, you can ensure the first radio button is always checked, so the action of the form is always correct, or check the value of the radiobutton and adapt the action of the form to that. It is easier to do the first option, the code does not need to change for that. You can set it between javascript tags, then place this code at the end of the body.

<script type="text/javascript">
document.getElementsById('RESI').checked=true;
</script>

If you want to do the second option, please tell me.
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.

 

Author Comment

by:pda4me
ID: 36938769
Okay, option #1 worked great in FF but I just tested in IE 7 and it still does the same thing?
0
 

Author Comment

by:pda4me
ID: 36938796
I tried moving the script to the bottom of the page and get the same thing?  How can I get this to function the same in IE and FF?
0
 
LVL 6

Expert Comment

by:bartvd
ID: 36938809
It could be a typo, try this:

<script type="text/javascript">
document.getElementById('RESI').checked=true;
</script>

If it still doesn't work, please use this:
<script type="text/javascript">
alert('test');
</script>

and test if there is a popup 'test' after you pressed the back button.
0
 

Author Comment

by:pda4me
ID: 36938913
Yes, I get the test prompt and replaced the code.  It works like a charm in FF just not IE...what do you think?
0
 
LVL 6

Accepted Solution

by:
bartvd earned 2000 total points
ID: 36938968
I don't have IE7, but I tested with IE8 and I had the same problem.
It works in IE8 when using this code in the header:

<script type="text/javascript">
function setRadiobutton()
{
document.getElementById('RESI').checked=true;
}
</script>

And adapt the body tag:

<body onLoad='setRadiobutton()'>

It does not work if you don't use the body tag, sorry.
0

Featured Post

Upgrade your Question Security!

Your question, your audience. Choose who sees your identity—and your question—with question security.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article discusses four methods for overlaying images in a container on a web page
This article discusses how to create an extensible mechanism for linked drop downs.
Learn how to match and substitute tagged data using PHP regular expressions. Demonstrated on Windows 7, but also applies to other operating systems. Demonstrated technique applies to PHP (all versions) and Firefox, but very similar techniques will w…
The viewer will learn how to look for a specific file type in a local or remote server directory using PHP.
Suggested Courses

593 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question