Извините, что я не включил «мою попытку» как таковую с этим, я бесполезен с jquery, поэтому мне нужен совет!
Я хотел бы изменить значение второго selctor на основе результатов первого.
У меня есть база данных строителей и регионов с заголовками builder_name и builder_region. Список заканчивается таким, как это …
builder_1 region_1 builder_1 region_2 builder_2 region_1 builder_3 region_1 builder_3 region_2 builder_3 region_3 (Вы получаете идею)
Я использую следующее в форме, которую я создал, чтобы получить список строителей для первого окна выбора …
echo '<select class= "ml-select" name="gen_builder">'; echo '<option value=" ">Select Builder</option>'; while($row = mysql_fetch_array($rsBUILDER)) { if($linebreak !== $row['builder_name']) { echo '<option value="'.$row['builder_name'].'">'.$row['builder_name'].'</option>'; } else {echo "";} $linebreak = $row['builder_name']; } echo '</select>';
$ Linebreak – избавиться от названий дубликатов компоновщиков из списка, что работает.
То, что я хотел бы получить, – это второй селектор, который выбирает доступные регионы, в зависимости от создателя, который был выбран в первом варианте. Я надеюсь в этом есть смысл????
Второй запрос должен посмотреть на построитель, выбранный в первом селекторе, и отфильтровать только те регионы, которые находятся в строках, с помощью селектора форм имени компоновщика.
Пожалуйста, скажите, если вам нужна дополнительная информация, я не очень разбираюсь в себе.
Как вы сказали, у вас нет опыта работы с jQuery или Ajax, я отправлю свой ответ с таким количеством комментариев, насколько это возможно. Я предполагаю, что у вас есть два варианта выпадающих списков на вашей странице.
Первый содержит строителей, поэтому он будет иметь id="builders" .
Второй содержит регионы, поэтому он будет иметь id="regions" .
Из того, что я понимаю, первый выбор будет именно тем, который вы отправили в своем вопросе, сгенерированным сервером (по PHP). Я только прошу вас внести незначительные изменения, сделав каждое значение параметра равным идентификатору базы данных строителя, а не его имени (если первичный ключ строителя не является их именем, а не идентификатором). Это не будет иметь никакого значения для конечного пользователя, но будет важно для нашего решения jQuery. Второй будет пустым, так как идея состоит в том, чтобы динамически его заполнять областями, связанными с построителем, выбранным в первом выпадающем списке.
Теперь давайте перейдем к коду jQuery:
//Everything that goes below this first line will be ready as soon as the page is fully loaded $(document).ready(function() { //The following code defines an event. More precisely, we are defining that the code inside it will run every time our select with id "builders" has its value changed $('#builders').change(function() { //$(this) is our builders select. $(this).val() contains the selected value, which is the ID of our selected builder var currentValue = $(this).val(); //Now, this is our Ajax command that will invoke a script called get_regions.php, which will receive the builder's ID in $_GET['builder_id'] and you can use to query your database looking for all regions related to this builder. Make sure to create an array with the returned regions. Your get_regions.php's last line should be echo json_encode($regions); $.get("get_regions.php", {'builder_id': currentValue}, function(data) { //Inside this function is the code that will run when we receive the response from our PHP script. It contains a JSON encoded list of regions, so first of all we need to parse this JSON var regions = $.parseJSON(data); //Before filling our second select dropdown with the regions, let's remove all options it already contains, if any $('#regions').empty(); //Now, all there is left is to loop over the regions, adding each as an option of the regions dropdown. I'll do it the universal way for (var i = 0; i < regions.length; i++) { var regionOption = '<option value="'+regions[i]['region_name']+'">'; regionOption += regions[i]['region_name']; regionOption += '</option>'; $('#regions').append(regionOption); } }); }); });
Несмотря на любые синтаксические ошибки (не могу проверить код здесь), это должно сделать трюк. Надеюсь, что комментарии были достаточно ясными, чтобы вы могли понять, как все работает в jQuery.