Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    Regular Coder
    Join Date
    Feb 2006
    Posts
    262
    Thanks
    23
    Thanked 1 Time in 1 Post

    Post 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>";
    ?>
    I already have a script which make me able to change the url of a div with ajax, this works well.

    Here is the code which do that:

    PHP Code:


    <script type="text/javascript">
    function 
    ahah(urltarget) {
      
    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(urltarget);};
        
    req.open("GET"urltrue);
        
    req.send("");
      }
    }  

    function 
    ahahDone(urltarget) {
      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(namediv) {
        
    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> 
    But if I do this, since i'm using php to write this it only write that.

    I don't know how can i make this work.

    Thanks!

  • #2
    Senior Coder Rowsdower!'s Avatar
    Join Date
    Oct 2008
    Location
    Some say it's everything.
    Posts
    2,027
    Thanks
    5
    Thanked 397 Times in 390 Posts
    Quote Originally Posted by Peuplarchie View Post
    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>";
    ?>
    I already have a script which make me able to change the url of a div with ajax, this works well.

    Here is the code which do that:

    PHP Code:


    <script type="text/javascript">
    function 
    ahah(urltarget) {
      
    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(urltarget);};
        
    req.open("GET"urltrue);
        
    req.send("");
      }
    }  

    function 
    ahahDone(urltarget) {
      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(namediv) {
        
    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> 
    But if I do this, since i'm using php to write this it only write that.

    I don't know how can i make this work.

    Thanks!
    This is really a javascript question. First, it looks like there is a problem with your onchange function's URL:

    Code:
    onchange="load('console_info.php?console?=','page')"
    //the second question mark does not belong...
    onchange="load('console_info.php?console=','page')"
    Then, to get that moving, what you can do is give your select element an id (for the example here I will use "my_select_box" for the id) and then grab the selected destination onchange by using document.getElementById('my_select_box').value in the load() function.

    It would look something like this:
    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) {
        var php_variable=document.getElementById('my_select_box').value; //let's say the selected value is "admin"
        name=name+php_variable;//should result in the URL being made into "console_info.php?console=admin";
        ahah(name,div);
        return false;
    }
    </script>
    The object of opening the mind, as of opening the mouth, is to shut it again on something solid. –G.K. Chesterton
    See Mediocrity in its Infancy
    It's usually a good idea to start out with this at the VERY TOP of your CSS: * {border:0;margin:0;padding:0;}
    Seek and you shall find... basically:
    validate your markup | view your page cross-browser/cross-platform | free web tutorials | free hosting


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •