Solved

PHP/MySQL Dyanmic Dropdown boxes on a single page

Posted on 2003-12-09
6
462 Views
Last Modified: 2013-12-12
Hello,

I am writing a PHP/MySQL web application for an auto parts website.

I wanted to have 4 dynamic dropdown boxes that will update its display when the OnChange event is triggered. Values in the list are fetched from a MySQL database. These 4 dropdown boxes are:

1)Car Make
2)Car Model
3)Parts Category
4)Car Parts

Car Model entries will depend on the Car Make values, and the Car Parts entries will depend on the Parts Category. Say... If i select BMW as the Car make, it will update the Car Model dropdown box with BMW car models. Same thing applies to the Parts Category, say.. if I select Body Parts in the Parts Category, it will update the Car Parts dropdown box with body parts.

On every change or display update, they should be able to preserve the selected values on other dropdown boxes.

Once satisfied with the selections, the form will now be submitted to a second script for further processing.

If possible, this script should be to ITSELF only and is NOT a multi page script.  

Please provide with a simple yet functional example of the code. Thank you very much and any help or thoughts are highly appreciated.


0
Comment
Question by:nyerky
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 2
6 Comments
 
LVL 1

Accepted Solution

by:
Katixa earned 75 total points
ID: 9904806
Hi,

I've done something similar before. I just used some JavaScript functions.

This is, when you click on "Car Make", you call a function on JavaScript that automatically sets the location of the document to itself, but you add some parameters.

pagename.php?make=xxx&model=xxx&cat=xxx&parts=xxx

You can do this just getting the values from the dropdown boxes. If my english is too hard to understand, just lets see some code example (it's ASP, but I guess you get it). Be aware if copy-pasting this, I just edited a bit... I just post it to use it at help, is not the solution:

______
function fCargar(combo) {
  var parameters = "&id=<%=Request.QueryString("id")%>"
  parameters += "&fecha=" + document.form1.Fecha.value
  parameters += "&tipo=" + document.form1.Tipo.options[document.form1.Tipo.selectedIndex].value
  parameters += "&tipotraba=" + document.form1.TipoTrabajo.options[document.form1.TipoTrabajo.selectedIndex].value
  parameters += "&estado=" + document.form1.Estado.options[document.form1.Estado.selectedIndex].value
  parameters += "&objeto=" + document.form1.Objeto.value
  parameters += "&latarea=" + document.form1.latarea.options[document.form1.latarea.selectedIndex].value
  if (document.form1.Tarea) parameters += "&tarea=" + document.form1.Tarea.options[document.form1.Tarea.selectedIndex].value
  parameters += "&hcom=" + document.form1.Hcom.value
  parameters += "&hfin=" + document.form1.Hfin.value

  if (combo.selectedIndex==0) {
    if (document.form1.CT) {
      if (document.form1.OT)
        window.location.href="linea.asp?ct=" + document.form1.CT.options[document.form1.CT.selectedIndex].value + "&ot=" + document.form1.OT.options[document.form1.OT.selectedIndex].value + parameters;
      else
        window.location.href="linea.asp?ct=" + document.form1.CT.options[document.form1.CT.selectedIndex].value + parameters;
    }
    else
      window.location.href="linea.asp?" + parameters.substring(1);
  }
  else {
    window.location.href="linea.asp?" + parameters.substring(1);
  }
}
________

If you check the "interesting" part, you will see that what I do is generate the string so I can then reload the page. In that PHP code you check the value of each parameter, and you then load each dropdown with the correcta value. Just add some "if this is the value, then write 'selected'" in the appropiate line, so the combo box gets the value selected.

If there is no make, you just don't process the others. You can add something like "Please select a make", and so on, depending on the value. When a make is selected, when the page gets reloaded, you select the Car Model table browsing only the models in that make. Now, when you click on this combo and select a value, you have to call a JavaScript function that generates again this string, so when the page gets reloaded you have the two combos with the selected values.

If there are more fields, you just pass all the values, like I do in the example above.


I hope you was able to understand this. If not, I will try to be more precise next time :)

Regards.
0
 

Author Comment

by:nyerky
ID: 9907929

Hello katixa,

Thank you for your comment. Can you provide me with a working example in PHP? Also, is the javascript cross-compatible with other browsers?

Thanks!
0
 

Assisted Solution

by:vadriewyn
vadriewyn earned 75 total points
ID: 10130129
mmmmm.. i'll write you the code for car make & car model.. juz changing a few things shld suffice for the parts category and car parts cuz they work the same way..

------------------------------------------------------------------------------------------------------------------

$sql = "SELECT <car make field> FROM <tablename>";  // this will giv you all the car makes
$result = $db->query($sql);  // assuming you hav another class file for database query
// if you dont, juz run the SQL statement with your usual mysql_query string and save the return
// to a variable called $result

echo "<form name='make' action='index.php?carmake=$carmake' method='post'>";
echo "<select name='carmake'>";
for ($a = 0; $a < mysql_num_rows($result); $a++) {
 $array = mysql_fetch_row($result);
 echo "<option name='$array[0]' value='$array[0]'>".$array[0]."</option>";
}
echo "</select>";
echo "</form>";
// above chunk shld giv you yur 1st dropdown box wif all the car makes in it..

// assuming you have regglobals set to true..
if ($carmake) {
 $sql = "SELECT <car model field> FROM <car model table> WHERE <car make field> = '$carmake'";
$result = $db->query($sql);

echo "<form name='model' action='index.php?carmodel=$carmodel' method='post'>";
echo "<select name='carmodel'>";
for ($a = 0; $a < mysql_num_rows($result); $a++) {
 $array = mysql_fetch_row($result);
 echo "<option name='$array[0]' value='$array[0]'>".$array[0]."</option>";
}
echo "</select>";
echo "</form>";
}

------------------------------------------------------------------------------------------------------------------

the above code shld generate your 2 dropdown boxes accordingly.. the car parts and parts category shld work the same way.. only thing you'd have to switch are the sql statements..

hope this helps..
0
 

Expert Comment

by:vadriewyn
ID: 10130276
oh btw i missed out somethin.. on each of the <select> you shld also add in the onchange method to submit the form.. e.g :

echo "<select name='carmodel' onchange='model.submit()'>"
// fyi it's onchange='<form name>.submit()'.. so whateva yur form is.. juz replace accordingly..
0

Featured Post

Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Developers of all skill levels should learn to use current best practices when developing websites. However many developers, new and old, fall into the trap of using deprecated features because this is what so many tutorials and books tell them to u…
Since pre-biblical times, humans have sought ways to keep secrets, and share the secrets selectively.  This article explores the ways PHP can be used to hide and encrypt information.
Learn how to match and substitute tagged data using PHP regular expressions. Demonstrated on Windows 7, but also applies to other operating systems. Demonstrated technique applies to PHP (all versions) and Firefox, but very similar techniques will w…
The viewer will learn how to create and use a small PHP class to apply a watermark to an image. This video shows the viewer the setup for the PHP watermark as well as important coding language. Continue to Part 2 to learn the core code used in creat…

736 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question