Не удается заменить изображение src на JQuery динамически, используя MySql

Question

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

Мой код просмотра;

<div class="card mb-4">
                <img id="artimg" src="" class="card-img-top" alt="Thumbnail [100%x225]"/>
</div>

Мой JQuery:

$('#mark').change(function(event){
    var citid = $(this).val();
    window.console && console.log('sending $_POST');
    $.post('mod/imgart.php', {'idc':citid}, function(data){
      $("#artimg").attr("src", data);
      window.console && console.log(data);
    });
  });

Моя модель:

<?php
  require_once "../pdo.php";

$stmt = $pdo->query("SELECT * FROM objects WHERE mark_id = {$_POST['idc']}");
  echo"<img src=''/>";
while($row = $stmt->fetch(PDO::FETCH_ASSOC)){
    echo"<img src='{$row['artic_image']}'/>";
};

* Примечание: я буду использовать заполнителии позаботиться об уколах

Я смотрю в консоль и данные правильно извлекаются (... Я пробовал также с images / chile / calle_yungay.png), но изображение не заменяется на экране ... пожалуйстапомощь!

Answer 1

Ваш mod/imgart.php выводит 2 полных img элемента.Удалите выходы <img src=''/> и выведите только значение, которое должно идти в атрибуте src.

$stmt = $pdo->prepare("SELECT artic_image FROM objects WHERE mark_id = ? limit 1");
$stmt->execute(array($_POST['idc']));
$row = $stmt->fetch(PDO::FETCH_ASSOC);
echo $row['artic_image']";

Я также для вас параметризован.Кроме того, не используйте *, когда вам нужен только 1 столбец, и не зацикливайте (while), когда вы хотите только 1 строку (я также добавил limit к вашему запросу. Если он собирается вернуть больше, чемВ 1 строке вы должны вернуть объект JSON и выполнить итерацию по нему в JS. Неясно, как вы будете заполнять несколько URL-адресов изображений, хотя в этом коде.

Варианты 2 для нескольких изображений:

$stmt = $pdo->prepare("SELECT artic_image FROM objects WHERE mark_id = ? limit 1");
$stmt->execute(array($_POST['idc']));
while($row = $stmt->fetch(PDO::FETCH_ASSOC)){
     echo '<img src="' . $row['artic_image'] . '" />';
}

Затем поместите полный список изображений в контейнер следующим образом (псевдокод, непроверенный):

$('#mark').change(function(event){
     var citid = $(this).val();
     window.console && console.log('sending $_POST');
     $.post('mod/imgart.php', {'idc':citid}, function(data){
          $("#populate_me").html(data);
         window.console && console.log(data);
     });
});