I have a problem with my mysql filled dropdown

[vinny69]

I have a problem with my mysql filled dropdown,

I am Working on some back coding for my boss, for a site for
a Vauxhall cars dealer, but i am having a problem.

I have made a dropdown list that displays all the available cars, with the car badge as a header like in this pic.

problem is, how do i make it only display the dealer once and not twice like in the pic above, i've been trying for hours, and now im getting really peeved off, so i turned to you clever people.

here is my code so far:

<?php

$con = mysql_connect("localhost","root","");
if (!$con) {
die('Could not connect: ' . mysql_error());
}
mysql_select_db("jbmotors", $con);
?>
<script>
function GO()
{
document.location="car.php?car=" + document.getElementById("drop_down_TheText").innerHTML;
}

function close()
{
document.getElementById('dropdown').style.display='none';
document.getElementById('drop_down_text').style.backgroundColor='transparent';
}
</script>
<div style="width:230px;">
 <input type="button" id="drop_down_button" value="Go" onclick="GO()" style="float:right; position:relative; top:-1px;" /> 

<div style="background:url('images/drop_down_bg.png'); width:200px;" onmouseover="document.getElementById('dropdown_img').src='images/drop_down_button_over.png'" onmouseout="document.getElementById('dropdown_img').src='images/drop_down_button.png'" onmousedown="document.getElementById('dropdown').style.display='block'; document.getElementById('drop_down_text').style.backgroundColor='steelblue'; document.getElementById('dropdown_img').src='images/drop_down_button_on.png'" onclick="document.getElementById('dropdown').focus();" onmouseup="document.getElementById('dropdown_img').src='images/drop_down_button_over.png'">
<img id="dropdown_img" src="images/drop_down_button.png" style="float:right; margin-left:2px;" />
<span style="position:relative; height:18px; top:2px; left:3px; width:178px;" id="drop_down_text">
<img src="images/drop_down_over.png" style="position:absolute; z-index:10; width:178px; height:20px;" />
<span style="pointer:default; position:absolute; z-index:20; width:178px;" id="drop_down_TheText">
</span>
</span>
</div>
<div id="dropdown" style="display:none; padding:2px; background:white; border:1px solid #E3E9EF; width:200px; border-top:none;" onblur="setTimeout('close()', 100);">
<?php
$sql2="SELECT * FROM cars ORDER BY make ASC";
$result2 = mysql_query($sql2);
while($row2 = mysql_fetch_array($result2))
 {
 echo "<center><img src='images/make/".$row2['make'].".png' style='height:80px;' /></center>";
 $sql="SELECT * FROM cars WHERE make='".$row2['make']."' ORDER BY model ASC";
$result = mysql_query($sql);
while($row = mysql_fetch_array($result))
 {
 $rand = RAND();
 echo "<div onclick='close(); document.getElementById(\"drop_down_TheText\").innerHTML=document.getElementById(\"".$rand."_text\").innerHTML' style='height:20px; width:100%;' onmouseover='this.style.backgroundColor=\"steelblue\"; document.getElementById(\"".$rand."_info\").style.display=\"block\";' onmouseout='this.style.backgroundColor=\"transparent\"; document.getElementById(\"".$rand."_info\").style.display=\"none\";'>";
 echo "<img src='images/drop_down_over.png' style='position:absolute; height:20px; width:196px;' />";
 echo "<span id='".$rand."_text' style='cursor:default; margin-left:2px; position:absolute; width:100%; z-index:10; text-align:center;'>".$row['model']."</span>";
 echo "<span style='margin-left:199px; background:steelblue; position:absolute; border:1px solid #E3E9EF; width:350px; display:none;' id='".$rand."_info'><img src='images/drop_down_over.png' style='height:80px; width:348px; position:absolute;' /><span style='height:80px;'></span><div style='position:absolute; z-index:10; padding:2px 5px;'>Quantity: ".$row['quantity']."<br>Drive Type: ".$row['drive_type']."<br>Engine Type: ".$row['engine_type']."<br>Doors: ".$row['doors']."</div><div style='padding:2px 5px; border-top:1px solid #E3E9EF'>More Info;<br>".$row['info']."</div></span>";
 echo "</div>";
 }
 }
?>
 </div>
</div>

<div style="position:absolute; top:15px; right:0; width:50%;">
<?php
echo "<select><option>SELECT MODEL</option>";
$sql="SELECT * FROM cars ORDER BY model ASC";
$result = mysql_query($sql);
while($row = mysql_fetch_array($result))
 {
echo "<option>".$row['make']." ".$row['model']."</option>";
 }
 echo "</select><input type='button' style='position:relative; top:1px; left:2px;' value='GO' />";
 ?>
</div>

Thanks in advance for all the help

Vinny

[DaiLaughing]

Move this line:

echo "<center><img src='images/make/".$row2['make'].".png' style='height:80px;' /></center>";

above the second while?

[johanafm]

No, it is above the second while already.

Change the first query, SELECT * FROM cars ORDER BY make ASC, to

$sql2="SELECT DISTINCT make FROM cars ORDER BY make ASC";

[DaiLaughing]

Thanks johan - I meant the first one. I struggled to understand what result vinny wanted so I assumed he wanted the make once then all the models so taking that echo out of the loop would give that result.

[vinny69]

Thanks Johan, that worked great

[tommyc21]

here is a shorter version

$combo = " <SELECT name=\"contact\"> ";

$sql = "select id , f_name from yourtable where ";
if ($rows = mysql_query($sql))
{ 
  while ($row = mysql_fetch_assoc($rows))
  {
    $id = $row["id"];
    $f_name = $row["f_name"];
    $combo .= "<OPTION value=\"$id\">$f_name</OPTION> ";
  }
}

$combo .= "</SELECT>";

print $combo;