Welcome to WebmasterWorld Guest from

Forum Moderators: coopster & jatar k

Message Too Old, No Replies

Auto populate fields from sql database.

Auto populate drop down fields

11:25 am on Oct 4, 2009 (gmt 0)

New User

5+ Year Member

joined:Oct 4, 2009
posts: 3
votes: 0

I need some help or tips on the following.

I have a .sql database file with the folowing structure:

`id` int(10) default NULL,
`Make` text,
`Model` text,
`Year_` text,
`Car_Fuel` text,

And here is a sample of the data inserted in to this database:

INSERT INTO `car` (`id`, `Make`, `Model`, `Year_`, `Car_Fuel`) VALUES
(1, 'Toyota', '4Runner SR5 4x4', '2004', 'Gasoline'),
(2, 'Ford', 'Fiesta 1.4', '2003', 'Diesel'),
(3, 'Seat', '4Runner SR5 4x4', '2004', 'Diesel'),
(4, 'Volkswagen 2.0', 'Golf', '2008', 'Gasoline'),
(5, 'Nissan', '300z', '2004', 'Petrol'),
(6, 'Ford', 'Fiesta 1.8', '2005', 'Gasoline'),
(7, 'Porsche', '356 America', '1952', 'Diesel'),
(8, 'Lancia', 'Hit', '1988', 'Gasoline'),

And so on... up to 42000 different cars

How would I get around to make auto populating dropdown boxes selecting data from the database in the following order:

First dropdown: Make
Second auto populate: Car_Fuel
Third: Year
And then only show the Models acording to the above.

Thanks beforehand for any help or tips at all, I have done other scripts but on this one I dont know where to start.

7:34 am on Oct 5, 2009 (gmt 0)

Senior Member

WebmasterWorld Senior Member 10+ Year Member

joined:Apr 9, 2005
votes: 0

You can use PHP to access and return the data in the DataBase, but will need to use JS / AJAX to do what you would like without re-loading the page.

The basics are:
<form action="" name="MyCarForm">
<option name="cars" onSelect="yourJSFunction('Toyota','Models')">Toyota</option>

<select style="display:none;" id="Models">

<select style="display:none;" id="Engine">

<select style="display:none;" id="Year">

yourJSfunction(carType,nextSelect) {
/* Make an AJAX request to the PHP page here passing 'carType' and 'nextSelect' to the PHP page and have your PHP page loop together the next set of options EG
<option name="models" onSelect="yourJSFunction('4Runner','Engine')">4 Runner</option>

(Passing 'carType' will give you the brand to select from and 'nextSelect' will let you know what to access on the PHP page: Models, Engine, Year)

echo the looped together list of the options they can select next.

/* Then on in your JS function */
document.getElementById(nextSelect).innerHTML = http.responseText;
document.getElementById(nextSelect).style.display = 'block';

Should give you a starting point anyway.

7:40 am on Oct 5, 2009 (gmt 0)

New User

5+ Year Member

joined:Oct 4, 2009
votes: 0

Ok thanks I'l give it a try and post back with the result