How to remove one or more images from the form
I only have a request, but I don’t know how to connect with deleting a picture, tell me the correct approach.

$c="DELETE FROM `images` WHERE id=$id"; $query1=$dbh->prepare($c); $query1->execute();` 
 <form id="form2" name="upload1" action="exit.php" method="POST" ENCTYPE="multipart/form-data"> <h4 align="center">Загрузка изображения</h4> <center> <input class="btn btn-success" id="zn" type="file" name="userfile[]" multiple accept="image/*" onchange="loadFile(event)"> <br> <input class="btn btn-success" type="submit" name="upload" id="upload" value="Загрузить"><br><br> <p>Предварительный просмотр</p> <img id="output" style="height: 300px; width: 300px; background-size: cover;" ><br></center> <br> <p align="center">Изображение товара</p> <? foreach($rows as $k=>$img){ ?> <img src="<?= $img['name'] ?>" id="output_<?=$k?>" data-id="<?=$img[id]?>" class="mg" style="height: 100px; width: 100px;" > <?}?> <input type="hidden" name="id" value="<?=$row[id]?>"> </form>

    1 answer 1

    Does the page display images saved in the database? Need to delete these images?

    Alternatively, make a button on each html next to each picture, on clicking on which the picture will be deleted:

     <span class="remove-img" data-id="<?=$img[id]?>">x</span>

    On js, make a handler that, when you click on a button, will send an ajax request to the server to delete the image:

     $('.remove-img').click(function () { var self = $(this); $.ajax({ url: '/ajax/removeImg', type: 'post', data: {'id' : self.data('id')}, dataType: 'json', success: function (data) { if (data.success) { alert('Изображение удалено'); $('[data-id="'+self.data('id')+'"]').remove(); // удаляем картинку по её id из DOM } } }); return false; });

    And it remains to write the php code that will accept this ajax request, take the id from $ _POST, delete the image with the query that you have already given. PHP may return a response such as json_encode(array('success' => true));