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 12 of 12
  1. #1
    Regular Coder
    Join Date
    Mar 2005
    Posts
    735
    Thanks
    4
    Thanked 1 Time in 1 Post

    populating 3 listboxes

    I was converting old asp files to php.

    But I'm stuck at this point.

    I'm looking for a triple combo listboxes where one has "book" the other "chapter" and the third "verse". The book is populated by a database table. Once book is selected then chapter is populated and then verse.

    Any tutorial related to this?

  • #2
    Regular Coder
    Join Date
    May 2005
    Posts
    563
    Thanks
    0
    Thanked 3 Times in 3 Posts
    There are a few ways to do it.

    1) Populate all 3 entirely and use javascript to show which ones you need at the time.

    2) Use AJAX to send a request that reloads just the select boxes each time.

    3) Reload the entire page each time one is changed.

    Which would you prefer?

  • #3
    Regular Coder
    Join Date
    Mar 2005
    Posts
    735
    Thanks
    4
    Thanked 1 Time in 1 Post
    But let's say the third option, if the page reloads then how will it keep memory of what's been selected?

    I like this one:
    http://www.dynamicdrive.com/dynamici...ects/index.htm

    I was using a recycled script from ASP, trying to convert it to php and feel that the same problem might reoccur. I want to use the example above.

    Populating the first listbox is alright. But when I don't know how to populate the 2nd listbox.
    Last edited by gilgalbiblewhee; 12-22-2007 at 12:44 AM.

  • #4
    Super Moderator Inigoesdr's Avatar
    Join Date
    Mar 2007
    Location
    Florida, USA
    Posts
    3,647
    Thanks
    2
    Thanked 406 Times in 398 Posts
    Quote Originally Posted by gilgalbiblewhee View Post
    But let's say the third option, if the page reloads then how will it keep memory of what's been selected?
    You would have it in a form which was posted via Javascript in the onchange tag for the select.
    Quote Originally Posted by gilgalbiblewhee View Post
    That one uses Javascript, and populates all of the options on pageload so it can be changed instantly without reloading. If you have a large number of options(books/chapters/etc.) this method isn't really feasible. The best method is the second suggestion(AJAX) if you have more than a few options.

  • #5
    Regular Coder
    Join Date
    Mar 2005
    Posts
    735
    Thanks
    4
    Thanked 1 Time in 1 Post
    I guess AJAX will be the better option then.

  • #6
    Regular Coder
    Join Date
    May 2005
    Posts
    563
    Thanks
    0
    Thanked 3 Times in 3 Posts
    Here is what I created when I was first learning AJAX.

    This simply sends what you have typed in a textfield to a php script that returns some html with a div that contains that text. This can be done with javascript but it is a simple working version.

    index.php
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>AJAX Test</title>
    <script language="javascript">
    
    var update = function (newtext) {
    	document.getElementById('txt').innerHTML = newtext;
    }
    
    var ajax = function (formid, url) {
    	var vars = '';
    	var f = document.getElementById(formid);
    	for (i = 0; i < f.elements.length; i++){
    		vars += f.elements[i].name + '=' + f.elements[i].value + '&';
    	}
    	var request = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject("MSXML2.XMLHTTP.3.0"); 
    	request.open("POST", url, true);
    	request.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    	request.setRequestHeader("Content-length", vars.length);
    	request.setRequestHeader("Connection", "close");
    	request.onreadystatechange = function() {
    		if (request.readyState == 4 && request.status == 200) {
    			if (request.responseText){
    				update(request.responseText);
    			}
    		}
    	};
    	request.send(vars);
    }
    </script>
    </head>
    <body>
    <form id="form1" action="javascript: ajax('form1', 'process.php');">
    <input name="test" type="text" />
    <input name="submit" type="submit" value="Click me" />
    </form>
    
    <p>
    <div id="txt"><b>User info will be listed here.</b></div>
    </p>
    </body>
    </html>
    process.php - processes the form data and gives it back inside a div, this is where you would generate the select boxes
    PHP Code:
    echo '<div style="color:#CC0000;">'.$_POST['test'].'</div>'

  • #7
    Regular Coder
    Join Date
    Mar 2005
    Posts
    735
    Thanks
    4
    Thanked 1 Time in 1 Post
    I'm converting ASP to PHP:
    PHP Code:
    <?php
    /*'Option Explicit*/
    ?>
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <html>
        <head>
            <title>Read the King James Bible</title>
            <script language="JavaScript" type="text/javascript">
            <!--
                function go(action) {
                
                // set variables pointing to the two forms we need
                var theForm = document.forms["myForm"];
                var otherForm = window.parent.document.forms["myForm"];
                
                // construct the "search" part of the URL from all the elements
                var query = "?Book=" + theForm.Book.options[theForm.Book.selectedIndex].value;
                query += "&Chapter=" + theForm.Chapter.options[theForm.Chapter.selectedIndex].value;
                
                // test to see if a verse has been selected, if not we won't pass the values
                if( theForm.verse.selectedIndex != -1 ) {
                    for( var i=0; i < theForm.verse.options.length; i++ ) {
                        if( theForm.verse.options[i].selected ) {
                            query += "&Verse=" + theForm.verse.options[i].value;
                        }
                    }
                }
                
                query += "&Keyword=" + escape(otherForm.Keyword.value);
                query += "&Keywordb=" + escape(otherForm.Keywordb.value);
                query += "&Keywordc=" + escape(otherForm.Keywordc.value);
                query += "&Keywordd=" + escape(otherForm.Keywordd.value);
                query += "&Keyworde=" + escape(otherForm.Keyworde.value);
                query += "&Keywordf=" + escape(otherForm.Keywordf.value);
                query += "&";
                
                // either redirect this page or the child frame depending on which select was changed
                if(action == "refresh") {
                    location.href = "showbook.php" + query;
                } else {
                    ifrVerse.location.href = "showverse.php" + query;
                }
                
                }
            //-->
            </script>
        </head>
        <body>
            <?php
    /*
                Dim Book
                Dim Chapter
                Dim Verse

                Dim DSNName
                Dim Conn
                Dim RS
                Dim SQL1
            
                Dim Keyword
            */
    ?>
            <table border="0" bgcolor="#FFFCDC">
                <td>
                    <form name="myForm" action="showverse.php" method="get" target="ifrVerse">
                        <table border="0" bgcolor="#FFFCDC">
                            <tr>
                                <th align="center" color="white">
                            </tr>
                             <tr>
                                 <th colspan="1" align="center">book</th>
                                 <th colspan="1" align="center">chapter</th>
                             </tr>
                            <tr>
                                <td>
                                     <?php
                                         
    require_once('mysql.php');
                                         

    /*
                                    'This function checks to see that numerical values are valid
                                     Function ValidateInt(SomeInt)
                                              if IsNumeric(SomeInt) = False or SomeInt = "" then
                                                 SomeInt = 1
                                              end if
                                    
                                     ValidateInt = SomeInt
                                     End Function
                                
                                
                                    'Setting up search variables
                    
                                    Book        = ValidateInt(request("book"))
                                    Chapter     = ValidateInt(request("Chapter"))
                                    Verse       = request("Verse")
                                    */
    ?>
                        
                                    
                                    <?php

    ?>
                        
                        <input type="hidden" name="Keyword" value="" />
                        <input type="hidden" name="Keywordb" value="" />
                        <input type="hidden" name="Keywordc" value="" />
                        <input type="hidden" name="Keywordd" value="" />
                        <input type="hidden" name="Keyworde" value="" />
                        <input type="hidden" name="Keywordf" value="" />
                        
    <?php                                
                        
    /*
                        <a name="bcv"><select name="Book" size="5" style="width:150px;" onChange="go('refresh');" 

    ></a> */
    ?>
                                            <?php
                                        $result 
    mysql_query("SELECT DISTINCT book_title, book FROM bible");
                                        
                                        echo 
    "<a name='bcv'><select name='Book' size='5' style='width:150px;' onChange=\"go('refresh');\"></a>"."\n";
                                        while(
    $row mysql_fetch_array($result))
                                          {
                                          
                                          echo 
    "<option value='" $row['book'] . "'>";
                                          echo 
    $row['book_title'];
                                          echo 
    "</option>"."\n";
                                          
                                          }
                                        echo 
    "</select>";
                                        
    //mysql_close($con);
                                            
    /*
                                            Do until RS.eof
                                                */
    ?>
                                                <?php
    /*<option if int(book) = int(RS("Book")) then response.write "selected" end if
     value="
    =RS("Book")
    ?>">=RS("Book_Title")</option>
                                                RS.movenext
                                                if RS.eof then
                                                    exit do
                                                end if
                                            loop
                                            

                                            </select>
                                    

                                    RS.Close
                                    */
    ?>
                                </td>
                                <td colspan="1" align="center">
                                    <?php
    /*
                                    'This SQL statement creates a list of books
                                    SQL1 = "Select DISTINCT(Chapter), Book FROM Bible WHERE Book = " & Book & " ORDER BY Chapter ASC"
                                    rs.Open sql1,conn, 1
                                        */
    ?>
    <?php
    /*                                    <select name="Chapter" size="5" style="width:75px;" onChange="go('refresh');" 'onchange="go2();">*/
    ?>


                                        <?php
                                        $result 
    mysql_query("SELECT DISTINCT chapter, book FROM bible WHERE book = " $row['book'] . "");
                                        
                                        echo 
    "<select name='Chapter' size='5' style='width:150px;' onChange=\"go('refresh');\">"."\n";
                                        while(
    $row mysql_fetch_array($result))
                                          {
                                          
                                          echo 
    "<option value='" $row['chapter'] . "'>";
                                          echo 
    $row['chapter'];
                                          echo 
    "</option>"."\n";
                                          
                                          }
                                        echo 
    "</select>";
                                        
    mysql_close($con);                                    
                                        
    /*
                                        Do until RS.eof
                                            */
    ?>
                                            <option <?php
    /*if int(Chapter) = int(rs("Chapter")) then response.write "selected" end if*/
    ?> value="<?php
    /*=RS("Chapter")*/
    ?>"><?php
    /*=RS("Chapter")*/
    ?></option>
                                            
                                            <?php
    /*
                                            rs.movenext
                                            if rs.eof then
                                                exit do
                                            end if
                                        Loop
                                        */
    ?>
                                        </select>
    I'm getting this error:
    <select name='Chapter' size='5' style='width:150px;' onChange="go('refresh');">
    <br />
    <b>Warning</b>: mysql_fetch_array(): supplied argument is not a valid MySQL result resource in <b>C:\xampp\htdocs\wheelofgod\search\cat\showbook.php</b> on line <b>192</b><br />

    </select>

  • #8
    Regular Coder
    Join Date
    May 2005
    Posts
    563
    Thanks
    0
    Thanked 3 Times in 3 Posts
    add this line above the line that is failing...

    PHP Code:
    var_dump($row); 
    I have a feeling $row isn't set at the time therefore the query can't complete properly which means it isn't a valid SQL result.

  • #9
    Regular Coder
    Join Date
    Mar 2005
    Posts
    735
    Thanks
    4
    Thanked 1 Time in 1 Post
    Quote Originally Posted by SeeIT Solutions View Post
    Here is what I created when I was first learning AJAX.

    This simply sends what you have typed in a textfield to a php script that returns some html with a div that contains that text. This can be done with javascript but it is a simple working version.

    index.php
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>AJAX Test</title>
    <script language="javascript">
    
    var update = function (newtext) {
    	document.getElementById('txt').innerHTML = newtext;
    }
    
    var ajax = function (formid, url) {
    	var vars = '';
    	var f = document.getElementById(formid);
    	for (i = 0; i < f.elements.length; i++){
    		vars += f.elements[i].name + '=' + f.elements[i].value + '&';
    	}
    	var request = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject("MSXML2.XMLHTTP.3.0"); 
    	request.open("POST", url, true);
    	request.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    	request.setRequestHeader("Content-length", vars.length);
    	request.setRequestHeader("Connection", "close");
    	request.onreadystatechange = function() {
    		if (request.readyState == 4 && request.status == 200) {
    			if (request.responseText){
    				update(request.responseText);
    			}
    		}
    	};
    	request.send(vars);
    }
    </script>
    </head>
    <body>
    <form id="form1" action="javascript: ajax('form1', 'process.php');">
    <input name="test" type="text" />
    <input name="submit" type="submit" value="Click me" />
    </form>
    
    <p>
    <div id="txt"><b>User info will be listed here.</b></div>
    </p>
    </body>
    </html>
    process.php - processes the form data and gives it back inside a div, this is where you would generate the select boxes
    PHP Code:
    echo '<div style="color:#CC0000;">'.$_POST['test'].'</div>'
    Would this apply to a triple listbox? I posted above that once the 1st listbox is populated I'm stuck with an error on the second listbox.

  • #10
    Regular Coder
    Join Date
    Mar 2005
    Posts
    735
    Thanks
    4
    Thanked 1 Time in 1 Post
    Quote Originally Posted by SeeIT Solutions View Post
    add this line above the line that is failing...

    PHP Code:
    var_dump($row); 
    I have a feeling $row isn't set at the time therefore the query can't complete properly which means it isn't a valid SQL result.
    Ok let me get this straight. I add that after the chapter's sql statement?
    I think some things have to be redefines because they're reused both in the book population and then the chapter population.

  • #11
    Regular Coder
    Join Date
    May 2005
    Posts
    563
    Thanks
    0
    Thanked 3 Times in 3 Posts
    Yeah, that's right. var_dump() just dumps the entire variable (shows structure and contents of an array) to make sure it's what you expect. Post the result here.

    Also, that AJAX I posted is just the basics, to make it work for you the best way would be to pass a <div> id with the function so it knows which part of html to update, then you can use it for any purpose, that really just sends and receives the information.

  • #12
    Super Moderator Inigoesdr's Avatar
    Join Date
    Mar 2007
    Location
    Florida, USA
    Posts
    3,647
    Thanks
    2
    Thanked 406 Times in 398 Posts
    Here is a rough example that might help. You would have to modify their PHP code to get the data from the database, but that won't be too hard.


  •  

    Posting Permissions

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