using php/ javascript to repopulate listbox

**gilgalbiblewhee** · Dec 26th, 2007, 01:41 AM

I have a combo of 3 listboxes which I would like to repopulate ( the 2nd and the 3rd listboxes ) after the selection of the 1st listbox. I don't understand how the page should refresh itself once selected.

PHP Code:


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>

    <head>

        <title></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>

        <table border="0" bgcolor="#FFFCDC">

            <td>

                <form name="myForm" id="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');

?>

                    

                    <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

                                    $result = mysql_query("SELECT DISTINCT book_title, book FROM bible");

                                    

                                    echo "<a name='bcv'><select name='Book' id='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>"."\n";

?>

                            </td>

                            <td colspan="1" align="center">



<?php

                                    $book = $_GET["Book"];

                                    $result = mysql_query("SELECT DISTINCT chapter, book FROM bible WHERE book = '" . $book . "'");

                                    

                                    echo "<select name='Chapter' id='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>"."\n";

                                    mysql_close($con);                                    

?>

                            </td>

                            </tr>

                            <td colspan="2" align="center">

                            </td>

                    

                    

                        </tr>

                        <tr colspan="2" align="center">

                            <th colspan="3" align="center" color="black">

                                verse

                            </th>

                        </tr>

                            <td colspan="2" align="center">

                            

                                    <select multiple name="verse" size="5" style="width:120;" onChange="go('update');"> 

                            </td>

                        <tr>

                            <td align="center" colspan="2">

                                <iframe name="ifrVerse" id="ifrVerse" src="blank.php" style="height:800px; width:250px;border:0;"></iframe>

                            </td>

                        </tr>

                    </table>

                </form>

            </td>

        </table>

    </body>

</html>

**visualAd** · Dec 26th, 2007, 05:42 PM

You need to use a little Javascript. If you want to be sleek, use the XMLHTTPRequest object to grab the list without refreshing the page or like the code above user a redirect to refresh the page.

Whatever you do I'd recommend you have a little PHP as possible inside the HTML, don't use the echo statement to produce HTML and use CSS instead of table to control the page layout.

**gilgalbiblewhee** · Dec 26th, 2007, 05:57 PM

I looked into AJAX and it looks interesting. But I'm stuck in the

PHP Code:


$q=$_GET["q"];

The error console shows:

Error: xmlDoc.getElementsByTagName("book")[0] has no properties
Source File: responsexml.js
Line: 26

q was previously the id number of the table. I changed it to book because I intend to build another listbox of chapters in the selected book.
So

PHP Code:


$q=$_GET["q"];

leads to the url in the js file where it says url=url+"?q="+str. str is found in function showUser (str) which leads to the select tag in book.php

Thread: using php/ javascript to repopulate listbox

Thread Tools

Display

using php/ javascript to repopulate listbox

Re: using php/ javascript to repopulate listbox

Re: using php/ javascript to repopulate listbox

Posting Permissions