SitePoint Sponsor |
|
User Tag List
Results 1 to 2 of 2
-
Dec 14, 2009, 21:13 #1
- Join Date
- Feb 2006
- Posts
- 85
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
onchange combo box, change url in div
Good day,
I'm populating a combo box and I'm working to onchange the url of a div.based on the value selected.
Here is my code :
PHP Code:
<?PHP
$console = $_GET['console'];
$dir = "Names/";
echo "<select name=\"console\" onchange=\"load('console_info.php?console=<SCRIPT language=\"javascript\">document.write(this.options[this.selectedIndex].value)</script>','page')\" onmouseclick=\"this.focus()\">";
// Open a known directory, and proceed to read its contents
$dir_handle = @opendir($dir) or die("Unable to open $dir");
$files = array();
while($file = readdir($dir_handle))
{
if($file != '.' and $file != '..')
{
$files[] = $file;
}
}
sort($files);
foreach($files as $file)
{
if($file != $console)
{
echo "<option value='$dir/$file'>$file</option>\n";
}else{
echo "<option value=\"$dir/$file\" selected=\"selected\">$file</option>\n";
}
}
echo "</select>";
?>
Here is the code which do that:
PHP Code:
<script type="text/javascript">
function ahah(url, target) {
document.getElementById(target).innerHTML = ' Fetching data...';
if (window.XMLHttpRequest) {
req = new XMLHttpRequest();
} else if (window.ActiveXObject) {
req = new ActiveXObject("Microsoft.XMLHTTP");
}
if (req != undefined) {
req.onreadystatechange = function() {ahahDone(url, target);};
req.open("GET", url, true);
req.send("");
}
}
function ahahDone(url, target) {
if (req.readyState == 4) { // only if req is "loaded"
if (req.status == 200) { // only if "OK"
document.getElementById(target).innerHTML = req.responseText;
} else {
document.getElementById(target).innerHTML=" Error:\n"+ req.status + "\n" +req.statusText;
}
}
}
function load(name, div) {
ahah(name,div);
return false;
}
</script>
onchange="load('console_info.php?console?=','page')"
The part I have problem with is the part when the combo box get changed with an onchange, I don't know how to add after the console?= as the user change the option .
example:
PHP Code:
<SCRIPT language=\"javascript\">document.write(this.options[this.selectedIndex].value)</script>
I don't know how can i make this work.
Thanks!
-
Dec 15, 2009, 06:42 #2
- Join Date
- Feb 2005
- Location
- Aveiro, Portugal
- Posts
- 165
- Mentioned
- 1 Post(s)
- Tagged
- 0 Thread(s)
All you need is to change your onchange event.
UseCode JavaScript:this.value
Code JavaScript:<SCRIPT language="javascript\">document.write(this.options[this.selectedIndex].value)</script>
Complete example using your some of your code:
Code HTML4Strict:<html> <head> <script type="text/javascript"> function ahah(url, target) { document.getElementById(target).innerHTML = ' Fetching data...'; if (window.XMLHttpRequest) { req = new XMLHttpRequest(); } else if (window.ActiveXObject) { req = new ActiveXObject("Microsoft.XMLHTTP"); } if (req != undefined) { req.onreadystatechange = function() {ahahDone(url, target);}; req.open("GET", url, true); req.send(""); } } function ahahDone(url, target) { if (req.readyState == 4) { // only if req is "loaded" if (req.status == 200) { // only if "OK" document.getElementById(target).innerHTML = req.responseText; } else { document.getElementById(target).innerHTML=" Error:\n"+ req.status + "\n" +req.statusText; } } } function load(name, div) { switch(name) { case "1": site = "http://www.google.pt"; break; case "2": site = "http://www.wikipedia.org"; break; case "3": site = "http://www.bbc.co.uk"; break; } ahah(site,div); return false; } </script> </head> <body> <form id="frm1" name="frm1"> <select id="sel1" name="sel1" size="1" onchange="load(this.value, 'res1')"> <option value="0">-Select-</option> <option value="1">Google</option> <option value="2">Wikipedia</option> <option value="3">BBC</option> </select> </form> <br /><hr /><br /> <div id="res1" name="res1"> </div> </body> </html>
HTHYours truely
Mário Ramos
Bookmarks