删除按钮不起作用 [英] Delete button not working
本文介绍了删除按钮不起作用的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
每当我按下删除按钮时，它会删除我只想删除该预览的所有预览...但是在服务器端它只删除一个图像..对于服务器端它不是问题...任何帮助将感谢...
我尝试过的事情：
Whenever I press the delete button it deletes all the previews I want to delete only that preview... but in the server side it deletes only one image.. for the server side its not an issue... Any help will be appreciated...
What I have tried:
<?php
if($_POST['image_form_submit'] == 1)
{
$con=new PDO("mysql:host=localhost;dbname=newimg","root","");
$images_arr = array();
foreach($_FILES['images']['name'] as $key=>$val){
$image_name = $_FILES['images']['name'][$key];
$tmp_name = $_FILES['images']['tmp_name'][$key];
$size = $_FILES['images']['size'][$key];
$type = $_FILES['images']['type'][$key];
$error = $_FILES['images']['error'][$key];
$rand = mt_rand(1000,10000000);
$target_dir = "uploads/";
$target_file = $target_dir.$_FILES['images']['name'][$key];
if(move_uploaded_file($_FILES['images']['tmp_name'][$key],$target_file)){
$images_arr[] = $target_file;
$addnew=$con->prepare("INSERT INTO attempt010(link,name,size,type)VALUES('$rand','$image_name','$size','$type')");
$addnew->execute();
}
$fetch_imgid=$con->prepare("SELECT id FROM attempt010 where link='$rand'");
$fetch_imgid->setFetchMode(PDO:: FETCH_ASSOC);
$fetch_imgid->execute();
$row=$fetch_imgid->fetch();
$delid = $row['id'];
}
//Generate images view
if(!empty($images_arr)){ $count=0;
foreach($images_arr as $image_src){ $count++?>
<span><ul class="reorder_ul reorder-photos-list" id="previewImg">
<li id="image_li_<?php echo $count; ?>" class="ui-sortable-handle">
<a href="javascript:void(0);" style="float:none;" class="image_link"><img src="<?php echo $image_src; ?>" alt=""></a>
<input type="text" name="imageCaption" id="imageCaption" placeholder="Enter Image Caption" />
<input type="submit" id="cap_btn" value="Caption Button" />
<?php
?>
<input type="submit" id="del_btn" value="Delete Image" />
</span>
</li>
</ul>
<script type="text/javascript">
$(document).ready(function () {
$("input#del_btn").click(function(){
$.ajax({
type: "POST",
url: "del.php", //
data: {id: <?php echo $delid; ?>},
success: function(){
var elem = document.getElementById('previewImg');
elem.remove();
},
error: function(){
alert("failure");
}
});
});
});
</script>
<script type="text/javascript">
$(document).ready(function () {
$("input#cap_btn").click(function(){
$.ajax({
type: "POST",
url: "addcap.php", //
data: {id: imageCaption},
success: function(){
var elem = document.getElementById('previewImg');
elem.remove();
},
error: function(){
alert("failure");
}
});
});
});
</script>
<?php
}
}
}
?>
这是html页面
and this is the html page
<!DOCTYPE html>
<html>
<head>
<title>Multiple Images Upload Using jQuery, Ajax and PHP by CodexWorld</title>
<link href="style.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script type="text/javascript" src="jquery.form.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('#images').on('change',function(){
$('#multiple_upload_form').ajaxForm({
target:'#images_preview',
beforeSubmit:function(e){
$('.uploading').show();
},
success:function(e){
$('.uploading').hide();
},
error:function(e){
}
}).submit();
});
});
</script>
</head>
<body>
<form method="post" name="multiple_upload_form" id="multiple_upload_form" enctype="multipart/form-data" action="upload.php">
<input type="hidden" name="image_form_submit" value="1"/>
<label>Choose Image</label>
<input type="file" name="images[]" id="images" multiple >
<div class="uploading none">
<label> </label>
<img src="uploading.gif"/>
</div>
</form>
<div class="gallery" id="images_preview"></div>
</div>
</body>
</html>
推荐答案
_POST ['image_form_submit'] == 1）
{
_POST['image_form_submit'] == 1) {
con = new PDO（mysql：host = localhost; dbname = newimg，root，）;
con=new PDO("mysql:host=localhost;dbname=newimg","root","");
images_arr = array（） ;
foreach（
images_arr = array(); foreach(
这篇关于删除按钮不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
