Jump to content

Button changing the src of an iframe


Recommended Posts

Hello I hope someone can help me. I have an internal website that hosts a support schedule. In short, people submit details via a form and it dumps it into an ODBC linked MS Access database. I also have a PHP page that retrieves all the tables from the database. I have a basic iframe calling it up as follows:

<iframe name="display" width="100%" height="80%" frameborder="0" marginwidth="0" marginheight="0" src="dbDisplay.php?month=all"></iframe>

If I create this

<a href="dbDisplay.php?month=All" target="display">All</a><a href="dbDisplay.php?month=Jan" target="display">Jan</a><a href="dbDisplay.php?month=Feb" target="display">Feb</a>

This creates clickable links on the page that work in affecting the PHP-calling iframe. In the PHP I can use the $_GET['month'] to call up the item I have clicked on. How do I get the links to be buttons? I have tried the following:

<button href="dbDisplay.php?month=Feb" target="display">Feb</button>

and If I change the iframe name to an id and try this

<iframe id="display" width="100%" height="80%" frameborder="0" marginwidth="0" marginheight="0" src="dbDisplay.php?month=all"></iframe> <button onclick="display.src=dbDisplay.php?month=Feb">Feb</button>

I have also tried a form

<form><input type="button" value="Feb" onclick="display.src=dbDisplay.php?month=Feb"><form>

However, nothing has worked yet. Any ideas?

Link to comment
Share on other sites

<button type='button' onClick="document.getElementById('display').src='dbDisplay.php?month=feb'">FEB</button>

Thanks. That is an idea, however it doesn't seem to be working. Here is my full code. I tried to edit what you gave me and this is where i am now:
<html> <head><title>Website</title><link rel="shortcut icon" href="/favicon.ico" /><link rel="icon" href="/favicon.ico" /> <script type="text/javascript">function jsFilter(strInc){document.getElementByID("display").src =  'dbDisplay.php?month=' + strInc;}</script> </head> <body style="background-image:url('Background.png');background-repeat:no-repeat;background-position:right top;background-color:#000066;color:#FFFFFF"> <form><input type="button" onclick="jsFilter('Jan2012')" value="Jan" /></form> <button type='button' onClick="document.getElementById('display').src='dbDisplay.php?month=feb' ">Feb</button> <button type='button' onClick="jsFilter('Mar')">Mar</button> <br /><iframe id="display" width="100%" height="65%" frameborder="0" marginwidth="0" marginheight="0" src="dbDisplay.php?month=All"></iframe> </body> </html>

None of the 3 buttons do anything

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Create New...