Jump to content

select list problem


clankill3r

Recommended Posts

I want to make a list like this:

schermafbeelding2011101.png

 

I store the genres in a array like this:

 

$genre_list = array(
array("ACTION", "First Person Shooter"),
array("ACTION", "Third Person Shooter"),
array("ACTION", "Tactical Shooter"),
array("ACTION", "Fighting"),
array("ACTION", "Arcade"),
array("ADVENTURE", "Adventure"),
array("ADVENTURE", "Platformer"),
array("ADVENTURE", "Point and Click")
);

 

This is my first attempt to only show the subgenre, i only get a blank list (apart from this <option value="genre">Genre</option> ).

 

			<div class="forminput">
			<select id="genres" name="genres">
				<option value="genre">Genre</option>
				<?php for($i=0; $i<count($genre_list[0]); $i++) { ?>
				<option value="<?=$i?>"<?=$genre_list[0][$i]?></option>
				<?php } ?>
			</select>
		</div>	

Link to comment
Share on other sites

			<div class="forminput">
			<select id="genres" name="genres">
				<option value="genre">Genre</option>
				<?php for($i=0; $i<count($genre_list[0]); $i++) { ?>
				<option value="<?=$i?>"<?=$genre_list[0][$i]?></option>
				<?php } ?>
			</select>
		</div>	

 

The loop is only intended for the first array: array("ACTION", "First Person Shooter").

The rest are not being traversed.

 

Try this in your code:

 

$count = count($genre_list);

for($i=0; $i<$count; $i++) {
echo $genre_list[$i][0];
echo $genre_list[$i][1];
}

Link to comment
Share on other sites

try this to create groups inside the select box:

 

<?php
$genre_list = array(
array("ACTION", "First Person Shooter"),
array("ACTION", "Third Person Shooter"),
array("ACTION", "Tactical Shooter"),
array("ACTION", "Fighting"),
array("ACTION", "Arcade"),
array("ADVENTURE", "Adventure"),
array("ADVENTURE", "Platformer"),
array("ADVENTURE", "Point and Click")
);
$group = '';
echo '<select id="genres" name="genres">';
foreach($genre_list as $item){
if($group == '' || $group != $item[0]) echo '<optgroup label="'.$item[0].'">';
$group = $item[0];
echo '<option value="'.$item[0].'-'.$item[1].'">'.$item[1].'</option>';
}
echo '</select>';
?>

Link to comment
Share on other sites

Another option is to build an array in a more logical format using the category/group name as the index and the genre's as sub-arrays.

 

This is much more logical IMHO

$genre_list = array
(
    "ACTION" => array("First Person Shooter", "Third Person Shooter",
                      "Tactical Shooter", "Fighting", "Arcade"),
    "ADVENTURE" => array("Adventure", "Platformer", "Point and Click")
)

echo "<select id='genres' name='genres'>\n";
foreach($genre_list as $genre => $subgenre_list)
{
    echo "<optgroup label='{$genre}'>\n";
    foreach($subgenre_list as $subgenre)
    {
        echo "<option value='{$genre}-{$subgenre}'>{$subgenre}</option>\n";
    }
}
echo "</select>\n";

Link to comment
Share on other sites

Of course, once you make the genre an option you lose the visual "grouping". But, you can use styles to simulate the same effect. But, I can't validate that the stylings will look the same from browser to browser. You'd have to test for yourself.

 

This will give you a "similar" look without using the OPTGROUP tag (at least in FF).

 

Define the following classes in your style sheet

.genreOption { font-weight: bold; font-style: italic;}
.subgenreOption { margin-left: 10px; }

 

Then change the code above to instead apply different styles based upon the value type

foreach($genre_list as $genre => $subgenre_list)
{
        echo "<option class='genreOption' value='{$genre}'>{$genre}</option>\n";
    foreach($subgenre_list as $subgenre)
    {
        echo "<option class='subgenreOption' value='{$genre}-{$subgenre}'>{$subgenre}</option>\n";
    }
}

 

NOTE: The style are only applied when you view the values with the list expanded. Once a value is selected and the select list closes it is displayed 'normally'

Link to comment
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.