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

#php #html #ajax #forms #jquery

#php #HTML #ajax #формы #jquery

Вопрос:

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

Вот мой код

         <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, во втором выпадающем списке будет показан список всех моделей, т.е.
Многомерные выражения
RDX
RL
TL
TSX
ZDX

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

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

Ответ №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, но это дает вам приблизительное представление о том, как это сделать, и я думаю, что сначала лучше сделать это просто.

Комментарии:

1. Извините, что я новичок в этом, но как мне это реализовать? Я добавляю приведенный выше скрипт в мой файл index.php с <?php ?> теги и тогда я теряюсь, что делать дальше. Я действительно пытаюсь узнать, можете ли вы помочь. Я ценю это!