Need Help

[Mav3n]

I have this form where the dropdown list contains names of Video Games...The list menu will contain the MAPS or BOARDS that are associated with that game. So when the user selects say...Counter-Strike the list menu is populated with all the possible MAPS that are associated with the game...The user can select all the maps he wants and then click SUBMIT...at that time...the Game name all the maps...and other stuff entered from the form...get posted on a db... I am creating a RECENT MATCHES for clan site.

I am thinking I need a javascript..But I don't know how to implement the js with the php.

[djdykes]

yeah i think JS would be the way to go with something like this... or .NET (boo!) you need to automatically postback the form right?

[Mittineague]

To use PHP variables in javascript do something like this

<script .......
var jsVar = <?php echo $phpVar; ?>;
.....

[Mandes]

Yes thats a javascript job.

You'll need to make an array for each item in your first dropbox, with an element for each option you want in the second dropbox when selected.

Name your form and both dropboxes and the javascript can then update the second dropbox contents from the array when an item has been chosen from the first dropbox.

Example

<script language="JavaScript">
<!--
var games=document.formname.games.options.length
var game=new Array(games)
for (i=0; i<games; i++)
game[i]=new Array()

game[0][0]=new Option("optiontext","optionvalue")
game[0][1]=new Option("optiontext","optionvalue")
game[0][2]=new Option("optiontext","optionvalue")
game[1][0]=new Option("optiontext","optionvalue")
game[1][1]=new Option("optiontext","optionvalue")
game[1][2]=new Option("optiontext","optionvalue")
game[1][3]=new Option("optiontext","optionvalue")
game[2][0]=new Option("optiontext","optionvalue")
game[2][1]=new Option("optiontext","optionvalue")
game[2][2]=new Option("optiontext","optionvalue")
game[2][3]=new Option("optiontext","optionvalue")
game[3][0]=new Option("optiontext","optionvalue")
game[3][1]=new Option("optiontext","optionvalue")
game[3][2]=new Option("optiontext","optionvalue")
game[3][3]=new Option("optiontext","optionvalue")
game[4][0]=new Option("optiontext","optionvalue")
game[4][1]=new Option("optiontext","optionvalue")


var temp=document.formname.boards
function getboards(x){
for (m=temp.options.length-1;m>0;m--)
temp.options[m]=null
for (i=0;i<game[x].length;i++){
temp.options[i]=new Option(game[x][i].text,game[x][i].value)
}
temp.options[0].selected=true
}
//-->
</script>

In the above I assume that the form will be named 'formname'
the first dropbox will be named 'games'
the second dropbox will be named 'boards'
change optiontext and optionvalue to suit your data

The handler

onChange="getboards(this.options.selectedIndex)"

should be added to the select statement for the games dropbox, this will invoke the javascript when you change the value.

Hope it helps

Terry

Edit:
Forgot to say, once you get it working you can script a douple loop in PHP to build your array from the contents of the database.

[Mav3n]

ACtually...I appreciate your help guys...But I have decided to NOT use a javascript approach..Instead I am keeping it with JUST php...Here is how I am doing it..
First I am using a paging method to better fit my needs..

my main code

<?php
###Matches Input Script###
require_once ('database.php');
require_once ('func2.inc.php');
if (!$_REQUEST['m'] == "1" || !$_REQUEST['m'] == "2" || !$_REQUEST['m'] == "3"){
echo "<form name=match_game method=post action=?m=2>";
dropdownform();
echo "<input type=submit name=next value=\"Next Step\">";
echo "</form>";
}
#########################Start of M-2###############################
if ($_REQUEST['m'] == "2") {

$result = mysql_query("SELECT gameid,game_name FROM games WHERE gameid = '$game'");
if (!$result) {
   echo 'Could not run query: ' . mysql_error();
   exit;
}
$row = mysql_fetch_row($result);

echo "Maps Available for <strong>" . $row[1];
echo"</strong>";
echo "<form name=match_maps method=post action=?m=3>";
echo "<input type=text value=\"$row[1]\"><br>";
ListMenuForm ();
echo "<input type=submit name=next value=\"Next Step\">";
echo "</form>";
}



?>

And here is my func1.inc.php

<?php

function dropdownform ()
{
    $query = mysql_query( "SELECT * FROM `games` ORDER BY `gameid` ASC");

    echo "<select name=\"game\">";

    while ( $array = mysql_fetch_array( $query ) )
    {

         echo "      <option value={$array['gameid']}>{$array['game_name']}</option>";
    }

    echo "</select>";
}




function ListMenuForm ()
{
    $query = mysql_query( "SELECT map FROM maps WHERE game_id = '$game'");
    
    echo "<select name=\"map\" size=\"5\" multiple>";

    while ( $array = mysql_fetch_array( $query ) )
    {
      $row1 = mysql_fetch_row($result);
         echo "      <option>{$row1[1]}</option>";
    }

    echo "</select>";
    
}
?>

I am having trouble with the function ListMenuForm () for some reason I cannot insert the correct data.

[Mandes]

Thats cluncky, and cheating !!!!

[Mav3n]

What do you mean clunky? lol

[Mandes]

Refreshing screen when no need to, breaks the flow of the user, hence clunky !

The difference between a round wheel and a triangular one.

[ShEx]

some nice xml http requests would be sweet for that job, but whatever works

[Mav3n]

It's just the javascript approach scares me...I don't know javascript therefore I am not able to do it...I am better off doing this and figuring this out then trying to worry about javascript lol.

The thing is...is that it doesn't work correctly...I am having a hard time displaying the MAPS in the list menu. I think it has to do something with the query or something along those lines.

[Mav3n]

Mandes I was reading your javascript...If I place my dropdown function in that wouldn't it work?

[Mav3n]

Ugh! Screw it...I will just do something else! LMFAO! Problem fixed.

[Mandes]

Your dropdown function gives you the games dropbox.

(By the way, why are you escaping all the " in the select code. This is code, only need to escape characters that are going to be saved or passed to other forms)

You will need to add a name="games" and the onchange handler I gave above to the select statement. Then just create the second dropbox with name="boards"

As I said above make sure that the form has a name="formname" statement too.

[Mav3n]

I do that because there are SPACES in the names of the games..IE: Rainbow Six 3. If you don't make it \"\" then it only displays the FIRST part of the name.

[Mav3n]

ok so my php script has

<?php
###Matches Input Script###
require_once ('database.php');
require_once ('func2.inc.php');
include ('test1.js');
echo "<form name=formname method=post>";
dropdownform();
echo "<select name=\"boards\" id=\"boards\">";
echo "<input type=submit name=next value=\"Next Step\">";
echo "</form>";
?>

and my func2.inc.php has

function dropdownform ()
{
    $query = mysql_query( "SELECT * FROM `games` ORDER BY `gameid` ASC");

    echo "<select name=\"games\" onChange=\"getboards(this.options.selectedIndex)\">";

    while ( $array = mysql_fetch_array( $query ) )
    {

         echo "      <option value={$array['gameid']}>{$array['game_name']}</option>";
    }

    echo "</select>";
}

I am sorry if I sound really stupid...I have just never dealt with js before

[Mandes]

I don't see that !!

You've put the slashes in the "name=....." part not the data part, how can that make a difference ??

Nearly all my dropboxes have spaces in the description text, never had to compensate for it.

[Mandes]

All looks OK, (except for the slashes)

[ShEx]

As far as i can see the slashes are in the right place, what do you mean, Mandes?

Mav3n needs to escape the " in the attribute values in the echo command as he is encapsulating the entire string in " as well. If Mav3n was using single quotes around the string then there wouldn't be a need to, but that looks good to me.

[Mittineague]

What kind of error messages are you getting? What does the screen output look like? Can you echo $varValues to pinpoint the problem area?

[Mandes]

As far as i can see the slashes are in the right place, what do you mean, Mandes?

Mav3n needs to escape the " in the attribute values in the echo command as he is encapsulating the entire string in " as well. If Mav3n was using single quotes around the string then there wouldn't be a need to, but that looks good to me.

My appologies Mav3n, (thanks ShEx).

I didn't notice the double quotes around the whole statement, probably because I don't program like that myself. I stand corrected.

[Mav3n]

I am not getting any error messages...The GAMES dropdown box is populating just fine....But I think that's because I am still using the query in my func2.inc.php...

This will take me some time..But I think that it will be well worth it in the end.

Again...No error messages
Main Page

<?php
###Matches Input Script###
require_once ('database.php');
require_once ('func2.inc.php');
include ('test1.js');
echo "<form name=formname method=post>";
dropdownform();
echo "<br>";
ListMenuForm ();
echo "<input type=submit name=next value=\"Next Step\">";
echo "</form>";
?>

func2.inc.php

<?php

function dropdownform ()
{
    $query = mysql_query( "SELECT * FROM `games` ORDER BY `gameid` ASC");

    echo "<select name=\"games\" onChange=\"getboards(this.options.selectedIndex)\">";

    while ( $array = mysql_fetch_array( $query ) )
    {

         echo "      <option value={$array['gameid']}>{$array['game_name']}</option>";
    }

    echo "</select>";
}




function ListMenuForm ()
{
    $query = mysql_query( "SELECT map FROM maps WHERE game_id = '$game'");
    
    echo "<select name=\"boards\" size=\"5\" multiple>";

    while ( $array = mysql_fetch_array( $query ) )
    {
      $row1 = mysql_fetch_row($result);
         echo "      <option value={$game}>{$row1[1]}</option>";
    }

    echo "</select>";
    
}
?>

Then the javascript

<script language="JavaScript">
<!--
var games=document.formname.games.options.length
var game=new Array(games)
for (i=0; i<games; i++)
game[i]=new Array()

game[0][0]=new Option("optiontext","optionvalue")
game[0][1]=new Option("optiontext","optionvalue")
game[0][2]=new Option("optiontext","optionvalue")
game[1][0]=new Option("optiontext","optionvalue")
game[1][1]=new Option("optiontext","optionvalue")
game[1][2]=new Option("optiontext","optionvalue")
game[1][3]=new Option("optiontext","optionvalue")
game[2][0]=new Option("optiontext","optionvalue")
game[2][1]=new Option("optiontext","optionvalue")
game[2][2]=new Option("optiontext","optionvalue")
game[2][3]=new Option("optiontext","optionvalue")
game[3][0]=new Option("optiontext","optionvalue")
game[3][1]=new Option("optiontext","optionvalue")
game[3][2]=new Option("optiontext","optionvalue")
game[3][3]=new Option("optiontext","optionvalue")
game[4][0]=new Option("optiontext","optionvalue")
game[4][1]=new Option("optiontext","optionvalue")


var temp=document.formname.boards
function getboards(x){
for (m=temp.options.length-1;m>0;m--)
temp.options[m]=null
for (i=0;i<game[x].length;i++){
temp.options[i]=new Option(game[x][i].text,game[x][i].value)
}
temp.options[0].selected=true
}
//-->
</script>

Like I said..I know nothing about js..so maybe I am missing a whole lot of stuff! lol

[Mandes]

OK, look at the source code produced in your browser (right mouse, view source). The javascript should look just like your js code above ?

[Mav3n]

View-> page source printed...

<script language="JavaScript">
<!--
var games=document.formname.games.options.length
var game=new Array(games)
for (i=0; i<games; i++)
game[i]=new Array()

game[0][0]=new Option("optiontext","optionvalue")
game[0][1]=new Option("optiontext","optionvalue")
game[0][2]=new Option("optiontext","optionvalue")
game[1][0]=new Option("optiontext","optionvalue")
game[1][1]=new Option("optiontext","optionvalue")
game[1][2]=new Option("optiontext","optionvalue")
game[1][3]=new Option("optiontext","optionvalue")
game[2][0]=new Option("optiontext","optionvalue")
game[2][1]=new Option("optiontext","optionvalue")
game[2][2]=new Option("optiontext","optionvalue")
game[2][3]=new Option("optiontext","optionvalue")
game[3][0]=new Option("optiontext","optionvalue")
game[3][1]=new Option("optiontext","optionvalue")
game[3][2]=new Option("optiontext","optionvalue")
game[3][3]=new Option("optiontext","optionvalue")
game[4][0]=new Option("optiontext","optionvalue")
game[4][1]=new Option("optiontext","optionvalue")


var temp=document.formname.boards
function getboards(x){
for (m=temp.options.length-1;m>0;m--)
temp.options[m]=null
for (i=0;i<game[x].length;i++){
temp.options[i]=new Option(game[x][i].text,game[x][i].value)
}
temp.options[0].selected=true
}
//-->
</script>
<form name="formname" method="post"><select name="games" onChange="getboards(this.options.selectedIndex)">      <option value=1>Rainbow Six 3</option>      <option value=2>Ghost Recon: Summit Strike</option></select><br><select name="boards" size="5" multiple></select><br><input type=submit name=submit value="Submit"></form>

[Mittineague]

The problem then is wth MAPS?

function ListMenuForm () {
    $query = mysql_query( "SELECT map FROM maps WHERE game_id = '$game'");
    echo "<select name=\"boards\" size=\"5\" multiple>";
    while ( $array = mysql_fetch_array( $query ) )
    {
      $row1 = mysql_fetch_row($result);
         echo "      <option value={$game}>{$row1[1]}</option>";
    }
    echo "</select>";
} 

The query is selecting "map" - one value
the array "$row1[1]" is a non existant value
Maybe $row1[0] or $row1['map'] would work?

[Mav3n]

function ListMenuForm ()
{
    $query = mysql_query( "SELECT game_id,map FROM maps WHERE game_id = '$game'");
    $row = mysql_fetch_row($query);
    
    echo "<select name=\"boards\" size=\"5\" multiple>";

    while ( $array = mysql_fetch_array( $query ) )
    {
         echo "      <option value={$game}>{$row[map]}</option>";
    }

    echo "</select>";
    
}