fields need to be dependent from each other - HOW?

[gwolff2005]

Hi guys,

I have an entry site with six fields, (country, town, school, language, course type, starting date) all of them take their content from the database.

(Just those countries will be shown, if someone registered from there)

However, if a visitor chooses e.g. country USA, and then schools, he will still be shown ALL schools, no matter if they are in the USA or not.

I need to change that!

How can I make the fields dependent from each other. So if a visitor chooses a country, that just the schools, the towns, the courses, etc.. will be shown in the other drop down menus from that particular country.

Thanks!

Here is my code:

<style type="text/css">
.search_panel { width: 250px; margin: 10px 0; }
.search_panel input { width: 220px; border: 2px solid #000643; padding: 5px; }
.search_panel select { width: 230px; border: 2px solid #000643; padding: 5px; }
</style>
<script>
$(function() { $( "#course_start_date" ).datepicker(); });


</script>
<div id="home">
  <div style="width: 500px; height:260px; padding: 40px 50px; margin: 0 auto; background-image: url(<?=base_url()?>images/front_blue.png); background-repeat: no-repeat;">

<form method="post" action="<?=site_url('search')?>">

	<div class="search_panel" style="float: left;">

		<select name="country" style="">
			<option value="">Choose a country</option>
			<?php if($countries): foreach($countries as $country): ?>
				<option value="<?=$country->school_country?>"><?=$country->school_country?></option>
			<?php endforeach; endif; ?>
		</select>

  </div>

	<div class="search_panel" style="float: left;">

		<select name="city">
			<option value="">Choose a city</option>
			<?php if($cities): foreach($cities as $city): ?>
				<option value="<?=$city->school_city?>"><?=$city->school_city?></option>
			<?php endforeach; endif; ?>
		</select>

	</div>

	<br clear="all"/>

	<div class="search_panel" style="float: left;">

		<input type="text" name="starting_date" id="course_start_date" value="Choose a starting date" onclick="this.value='';"/>

	</div>

	<div class="search_panel" style="float: left;">

		<select name="course_type">
			<option value="">Course type</option>
			<?php if($course_types): foreach($course_types as $course_type): ?>
				<option value="<?=$course_type->course_type?>"><?=$course_type->course_type?></option>
			<?php endforeach; endif; ?>
		</select>

	</div>

	<br clear="all"/>

	<div class="search_panel" style="float: left;">			

		<select name="school_name">
			<option value="">Search by school name</option>
			<?php if($schools): foreach($schools as $school): ?>
				<option value="<?=$school->school_name?>"><?=$school->school_name?></option>
			<?php endforeach; endif; ?>
		</select>

	</div>

	<div class="search_panel" style="float: left;">

		<select name="language">
			<option value="">Search by language</option>
			<?php if($languages): foreach($languages as $language): ?>
				<option value="<?=$language?>"><?=$language?></option>
			<?php endforeach; endif; ?>
		</select>

	</div>

	<br clear="all"/>

	<center>
	  <p><br />
	    <input type="image" src="<?=base_url()?>images/search.png"/>
      </p>
  </center>

</form>

  </div>

</div>