как заполнить при выпадающем основании значение из другого выпадающего списка в php и jquery?

У меня есть одна drop down, которая заполняется из базы данных, и на той же странице у меня есть второй снимок, который будет заселен из значения 1-го.

Я хочу использовать ajax для этого, так что я должен сделать для этого. И учебник или ссылку, откуда я могу решить свою проблему.

Обновлено: Вот код, который я использовал.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script> <script type="text/javascript"> $('#cat').onChange(function(){ alert("oncha"); if($('#cat').val() == 'uprofile'){ file = 'uprofile.html'; }else if ($('#cat').val() == 'other'){ file = 'city.html'; } $('#city').change(function(){ loadusers = $.ajax({ type: "GET", url: file, cache: false, success: function (html) { $("#city").html(html); } }); }); }); </script> <tr> <td class="label"><span id="required_span">* </span>Category</td> <td colspan="2" class="data"><select name="cat" id="cat"> <option value="0">--Select Category--</option> <option value="O/O">O/O</option> <option value="company driver">company driver</option> <option value="other">other</option> </select></td> </tr> <tr> <td class="label"><span id="required_span">* </span>City</td> <td colspan="2" class="data"><select name="city" id="city"> <option value="0">--Select city--</option> </select></td> </tr> 

Вот содержание city.html

 <option>1</option> <option>2</option> 

Но не может работать даже функция предупреждения. Что мне не хватает в коде?