douren1891 2017-08-03 07:42
浏览 48

多个图像上传,带有预览和删除选项-php / Ajax

I have code below that runs perfectly and uploads multiple images.

This is the html and php code:

    <?php
include_once 'includes.php';
include 'includes/getExtension.php';
$valid_formats = array("jpg", "png", "gif", 
"bmp","jpeg","PNG","JPG","JPEG","GIF","BMP");
if(isset($_POST) and $_SERVER['REQUEST_METHOD'] == "POST")
    {
   $group_id=$_POST['group_id'];
   if(empty($group_id))
   {
   $group_id='';
   }
   $v='';   
   $i=1;       
   foreach ($_FILES['photos']['name'] as $name => $value)
    {

    $filename = stripslashes($_FILES['photos']['name'][$name]);
    $size=filesize($_FILES['photos']['tmp_name'][$name]);
    //get the extension of the file in a lower case format
      $ext = getExtension($filename);
      $ext = strtolower($ext);

     if(in_array($ext,$valid_formats))
     {
       if($size<(1024*$uploadImageSize))
       {

       $actual_image_name = 'user'.$uid.'_'.time().$i.".".$ext;

                         if(move_uploaded_file($_FILES['photos']['tmp_name']
[$name], $upload_path.$actual_image_name))
                            {
                                $data=$Wall-
>Image_Upload($uid,$actual_image_name,$group_id);
                                 $newdata=$Wall-
>Get_Upload_Image($uid,$actual_image_name);
                                 if($newdata)
                                { 
                                    if(empty($v))
                                    $v=$newdata['id'];
                                    else
                                    $v=$v.','.$newdata['id'];

echo '<img src="'.$base_url.$upload_path.$actual_image_name.'"  
class="preview" id="'.$v.'"/>';

                                }
                            }
                            else
                         {
                            echo "Fail upload fail.";
                         }


       }
       else
       {
        echo '<span class="imgList">You have exceeded the size limit!
</span>';

       }

      }
      else
     { 
        echo '<span class="imgList">Unknown extension!</span>';

     }
       $i=$i+1;
 }

    }
?>

The code adds multiple images and shows previews of the images too. But now I want that when a user clicks on some button (delete button) on every image uploaded, it should be removed not hidden (during the upload preview).

Any help to this will be appreciated! Please note I am able to delete already uploaded images on the database but on this one I need to be able to delete during upload. I also have the following Ajax code:

    /* Remove Image */
$('.imageDelete').on('click',function()
{
var P=$(this);
var pid = $(this).attr("id");
var dataString = 'pid='+ pid ; 
$.ajax({
type: "POST",
url: $.base_url+"image_delete_ajax.php",
data: dataString,
cache: false,
success: function(html)
{
jConfirm("Sure you want to delete this image? There is NO undo!", '',
function(r)
{
if(r==true)
{
P.parent().fadeOut('slow');
$('#photosContainer').masonry( 'remove', P.parent());
$('#photosContainer').masonry( 'reload' );
}
});

}
});
return false;
});

And the following image_delete_ajax.php file that works perfect:

    <?php

include_once 'includes.php';
if(isSet($_POST['pid']))
{
$pid=$_POST['pid'];
$data=$Wall->Delete_Image($uid,$pid,$upload_path);
echo $data;
}
?>
  • 写回答

0条回答 默认 最新

    报告相同问题?

    悬赏问题

    • ¥15 BP神经网络控制倒立摆
    • ¥20 要这个数学建模编程的代码 并且能完整允许出来结果 完整的过程和数据的结果
    • ¥15 html5+css和javascript有人可以帮吗?图片要怎么插入代码里面啊
    • ¥30 Unity接入微信SDK 无法开启摄像头
    • ¥20 有偿 写代码 要用特定的软件anaconda 里的jvpyter 用python3写
    • ¥20 cad图纸,chx-3六轴码垛机器人
    • ¥15 移动摄像头专网需要解vlan
    • ¥20 access多表提取相同字段数据并合并
    • ¥20 基于MSP430f5529的MPU6050驱动,求出欧拉角
    • ¥20 Java-Oj-桌布的计算