4

Необходимо сделать зависимый список Марка — Модель автомобилей, где оба значения OPTION берутся из Mysql базы данных 2 разных таблиц и подгружаются без перезагрузки страницы с помощью Ajax.

Проект использует ORM Red Bean PHP. https://redbeanphp.com/index.php

Важный момент: На любой странице (к примеру index.php, sell.php и других) должно работать 3 пары зависимых select’a с одинаковыми данными из 2-х таблиц. Марка и модель автомобилей.

То есть

10 строка страницы index.php: марка — модель

58 строка страницы index.php: марка - модель

987 строка страницы index.php: марка - модель

И все это на любой их страниц.


Таблица 1. mark

Содержит поля:

id (числа от 1 до 150)

mark (название марки на английском языке, например Audi)


Таблица 2. model

Содержит поля

id (числа от 1 до 1700) Идут по степени увеличения.

model (название модели на английском языке, например Q8)

mark_id (числа от 1 до 100 соответствующие id марки из таблицы mark) mark_id из таблицы model сопоставляется с id из таблицы mark и таким образом выводятся модели.


Данный код выводит все марки вместе с id.

<?php

     $marks = R::getAll('SELECT id, mark FROM mark');

?>




  <select class="select2" name="mark" id="mark" required>
    <option value="" disabled selected>Select mark</option>
    
           <?php if (isset($marks)): ?>
                        <?php foreach ($marks as $mark): ?>
                            <option value="<?=$mark['id']; ?>"><?=$mark['mark']; ?></option>
                        <?php endforeach; ?>
                    <?php endif; ?>
    
</select>

Здесь должны подгружаться модели вида id и model.

<option  id="model"  value=”Здесь было id модели цифра”>Cayenne(а здесь model, к примеру указанная)</option>

SCRIPT.

<script>
function getMark() {
        var str='';
        var val=document.getElementById('mark');
        for (i=0;i< val.length;i++) { 
            if(val[i].selected){
                str += val[i].value + ','; 
            }
        }         
        var str=str.slice(0,str.length -1);
        
    $.ajax({          
            type: "GET",
            url: "mark-model.php",
            data:'mark_id='+str,
            success: function(data){
                $("#model").html(data);
            }
    });
}
</script>  

Файл mark-model.php отвечающий за выбор model в зависимости от выбранной mark.

if ($_GET['mark']) {
    $model = R::findAll('model', 'ORDER BY model ASC WHERE `mark_id` = ?' . $_GET['mark']);
   
  
  print json_encode($model);
  
} 
 

// Хз как правильно прописать запрос и вывод.


Оба значения select постоянно видимы для пользователя и выпадающий список mark и выпадающий список model.

Нужен работающий скорректированный код, прошу помощи за хорошее репутационное вознаграждение в 350 баллов.

КОРРЕКТИРОВКИ

К чему мы приходим с пользователем @Егор Банин ,почти добрались до ответа.

Страница index.php

<?php  
        $marks = R::getAll('SELECT id, mark FROM mark');  
 ?>




  <select class="select2" name="mark" id="mark" required>
    <option value="" disabled selected>Select mark</option>

           <?php if (isset($marks)): ?>
                        <?php foreach ($marks as $mark): ?>
                            <option value="<?=$mark['id']; ?>"><?=$mark['mark']; ?></option>
                        <?php endforeach; ?>
                    <?php endif; ?>

</select>


// Здесь должны выводиться модели

<select name="model">
    <?php foreach($models as $model): ?>
        <option value="<?= $model->id ?>"><?= htmlspecialchars($model->model) ?></option>
    <?php endforeach ?>
</select>
     
     <div id="model"></div>


mark-model.php

<?php


if ($_GET['mark']) {
   
  $models = R::findAll('model', 'mark_id = :mark_id order by model', [':mark_id' => (int)$_GET['mark']]);
  
  print json_encode($model);
  
} 
 
?>

AJAX

$.ajax({
    type: "GET",
    url: "mark-model.php",
    data:'mark='+str,
    success: function(data){
        $("#model").html(data);
    }
});
0

1 ответ 1

3
+175

Как я понял, вам надо сделать два select'а -- марка и модель. Значения select'а модели должны зависеть от выбранной марки. И вы хотите на каждое изменение значения select'а марки перестраивать select моделей, загружая подходящие модели.

  1. Как получить подходящие модели

Когда вы выбрали марку у вас есть её id. Модели, которые вам нужны все имеют mark_id равный этому id. Какой бы SQL-запрос вы написали, чтобы получить эти модели?

select *
from `models`
where `mark_id` = ?
order by `model`

Как это записать используя RedBeanPHP? Думаю как-то так:

$models = R::findAll('model', 'mark_id = :mark_id order by model', [':mark_id' => (int)$_GET['mark']]);

Строка 'mark_id = :mark_id order by model' -- это кусок SQL, который RedBeanPHP подставит в итоговый запрос. Поэтому order by должен быть в конце по правилам SQL-синтаксиса.

  1. Как вывести модели в виде options select'а?

Так же как и в случае с марками

<select name="model">
    <?php foreach($models as $model): ?>
        <option value="<?= $model->id ?>"><?= htmlspecialchars($model->model) ?></option>
    <?php endforeach ?>
</select>

mark-model.php должен вернуть только <select name="model">...</select>. Полученный HTML можно вставить в документ целиком.

  1. Как вставить html-список в документ?

Нужно какое-то специальное место в документе, куда будет помещён загруженный список. Своего рода плэйсхолдер. У вас это <option id="model" ...> -- плохой выбор. Нельзя помещать select в option. Пусть лучше это будет <div id="model"></div>. Тогда ваш код, поместит загруженный select моделей в div.

$.ajax({
    type: "GET",
    url: "mark-model.php",
    data:'mark='+str,
    success: function(data){
        $("#model").html(data);
    }
});

Чтобы получить работающий скорректированный код, вам надо постараться изложить задачу более ясно и последовательно. Обратите внимание на точность и корректность формулировок. Например: "Необходимо сделать зависимый список ..., где оба значения OPTION ..." -- оба? У одного option одного списка может быть только одно значение. Или: "должно работать 3 пары зависимых select’a с одинаковыми данными из 2-х таблиц. Марка и модель автомобилей." 3 пары это 6 select'ов, а марка и модель автомобиля это только 2 select'а. Что же вам нужно? Списки должны дублироваться или это совсем другие списки? "И все это на любой их страниц." Чьих их?

Это не просто придирки. Как только вы сформулируете задачу чётко и ясно, вы сами увидите её решение. Работа программиста и заключается в том, чтобы понимать и правильно формулировать задачи. А записать ясную мысль с помощью кода -- дело техники.

9
  • Спасибо за ваши подсказки, но к сожалению, марки так и не выводятся как и прежде. На одной странице нужно сделать 3 раза марка-модель, данные для которых берутся из таблиц mark-model. Скажите какую информацию вам нужно дополнительно, чтобы наконец мы решили эту задачу. Я попал в какое-то болото с этой задачей, чем больше усилий прилагаешь, тем дольше остаешься в том же месте. Commented 12 янв. 2021 в 10:03
  • 1
    @Eric7777777 изолируйте проблему. Если у вас получится сделать 1 раз, то сделать ещё 2 будет просто. Марки вывести в select вам так и не удалось? Начните с этого. "Данный код выводит все марки вместе с id." добавте этот код туда, где строите страницу каталога (index.php, если я понял вас правильно). Когда заработают марки, переходите к следующей задаче -- модели. Commented 12 янв. 2021 в 11:21
  • 1
    @Eric7777777 $models = R::findAll('model', 'mark_id = :mark_id order by model', [':mark_id' => (int)$_GET['mark']]); Что в $models? Попробуйте сделать var_dump($models);. Там скорее всего то что надо. Теперь эти модели надо вывести как select (см 2. Как вывести модели в виде options select'а?). Поучилось? Запрос прям из браузера /mark-model.php?mark=1 что возвращает? Commented 12 янв. 2021 в 13:43
  • 1
    @Eric7777777 Отлично! Теперь поправьте свой js-код и всё должно заработать. Я накидал простенькую демку codepen.io/EgorBanin/pen/ZEpqKNw Я заменил вызов /mark-model.php?mark=1 на html-заглушку, но думаю вы разберётесь что к чему. Commented 12 янв. 2021 в 17:19
  • 1
    Давайте продолжим обсуждение в чате. Commented 13 янв. 2021 в 7:03

Ваш ответ

Нажимая «Отправить ответ», вы соглашаетесь с условиями пользования и подтверждаете, что прочитали политику конфиденциальности.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.