Форма Ajax, 2 раскрывающихся списка с внешним источником

Question

есть ли способ, как только я выбираю из выпадающего списка на форме, что он будет выбирать все модели из первого выпадающего списка во втором выпадающем списке

Вот мой код

        <form>
            <div class="landing_quote_left">
                <table cellpadding="0" cellspacing="8" border="0">
                    <tr>
<td>
                            <label for="ajax_make_id" class="landing_quote_label">Make:</label>
                        </td>
                        <td>
                            <span id="ajax_make_select"><select name="2f_make_id" id="ajax_make_id" style="width: 170px;" onchange="Landing.getMakeFace(this.value);"><option value="999">Select a Make</option><option value="1">Acura</option><option value="2">Audi</option</select></span>

                        </td>
                    </tr>
                    <tr>
                        <td>
                            <label for="ajax_model_id" class="landing_quote_label">Model:</label>
                        </td>
                        <td>
                            <span id="ajax_model_select">

                                <select name="2f_model_id" id="ajax_model_id" style="width: 170px;" onchange="Landing.getModelFace(this.value);">
                                    <option value="">Loading...</option>
                                </select>
                            </span>
                        </td>
                    </tr>
                </table>
            </div><!-- END landing_quote_left -->
        </form>

Так что, если я выберу Acura, во втором выпадающем списке будет показан список всех моделей, т.е. MDX RDX RL TL TSX ZDX

Если возможно, как бы мне, чтобы оба выпадающих меню загружались из разных файлов. {php или xml или что-либо еще возможно}

Спасибо за ваше время!

Answer 1

Вот примерный код о том, как этого добиться.

При загрузке страницы заполните раскрывающийся список1.

$(function(){
    $.get('file1.php', function(data){
       $('#dropdown1').html( data ); 
    });

    // on change of dropdown1 populate dropdown2 with the respective data 
    $('#dropdown1').change(function(){
        $.get('file2.php',{ make: $(this).val() }, function(data){
            $('#dropdown2').html( data ); 
        }); 
    }); 
}); 

Таким образом, в вашем file2.php вы можете проверить массив $_GET для переданной переменной make, затем вы можете отправить обратно все параметры для этой модели.Вы также можете отправить обратно json вместо html, но это дает вам приблизительное представление о том, как это сделать, и я думаю, что сначала лучше сохранить его простым.