Delete function with check boxes for multiple files/folders

Question

I am building a dropbox like application with php and javascript. I am trying to build a delete function to delete multiple files and folders at once. The code below demonstrates each and every row. This was done in php to dynamically display all folders stored in the server:

<?php
foreach ($files as $file) {
    echo '<li class="browse-file">
            <div class="select-all-col"><input name="select" type="checkbox" class="select" id="'.$file.'"/></div>
            <div class="file-name-col"><a href="my-home.php?name='.$folderName."/".$file.'" style="cursor: pointer;">'.$file.'</a></div>
            <div class="kind-col">folder</div>
            <div class="date-modified-col">'.date ("F d Y H:i:s.", filemtime($_SESSION['currentDir']."/".$file)).'</div>
            <br />
        </li>';
                }
?>

The following is a link to delete all the checked folders:

<a href="#" id="delete">Delete</a>

I need some code that iterates through all the check boxes and than gets those that are checked to send them to the server. The server than deletes those folders/files. Can anyone please suggest me what I can do to achieve this?

score 2 · Accepted Answer · edited May 23 '17 at 12:09

2

You can loop over files you have checked using phps foreach loop.

Here's example for that kind of delete script:

$path_to_folder = "folder/";
foreach ($_POST['select[]'] as $file) {
    if(file_exists($path_to_folder . $file))) {
        unlink($path_to_folder . $file); 
    }
    elseif(is_dir($file)) {
        rmdir($file); // or system("rm -rf " . escapeshellarg($dir)); 
    }
}
echo "Files deleted successfully.";

And you better pass value from checkbox, not its id. Remember also add brackets to your input's name, because then php recognizes it as array.

<input name="select[]" type="checkbox" class="select" value="'.$file.'"/>

See more on this question: How do I recursively delete a directory and its entire contents (files + sub dirs) in PHP?

edited May 23 '17 at 12:09

Community

1
1

answered Dec 15 '13 at 15:06

aksu

5,221
5
24
39

Thanks for your good explanation. It was really helpful to understand how I can do this. But I have one more question, How can I make my delete link to post to the server? – Jonathan Mallia Dec 16 '13 at 14:03
You have to add form which controls data to be sent to server. And add those checkboxes in it. Then you can use this submit link(acts like submit button): `Delete selected ` Don't forget to accept my answer :) – aksu Dec 16 '13 at 15:44
Yes I managed to do it as you said. I have added a form and included the checkboxes like this:
and then in the link I added: Delete. Thanks for your time and patience :)
– Jonathan Mallia Dec 16 '13 at 17:37

score 0 · Answer 2 · answered Mar 16 '17 at 12:02

$(document).ready(function(){
 $('#btn_delete').click(function(){
        var id = [];
        $(':checkbox:checked').each(function(i){
        id[i] = $(this).val();
        });
        $.ajax({
        headers : {'X-CSRF-TOKEN' : $('input[name=_token]').val()  },
        url:'/images/multiple',
        method:'POST',
        data:{id:id},
        success:function()
        {
      window.location.reload();
        }
        });


 });
});

<div class="col-lg-9 animated fadeInRight">
  <div class="row" >
    <div align="left" id="btn-p">
      <div id="btn-c">
        @if($folder)
          <button type="button" name="btn_delete" id="btn_delete" class="btn btn-info"><span style="color:red; font-size: 1.50em;"><i class="fa fa-trash pull-right" aria-hidden="true"></i></span></button>
        @endif
      </div>
    </div>
    <div class="col-lg-12" id="image-p">
      <div class="file" id="image-c">

        @foreach ($images as $image)
         <div class="col-lg-3" style="min-height:350px">
          <label class="pull-left"><input type="checkbox" value="{{$image->id}}" name="checkbox[]" id="checkAll"/></label>

            <td><a style="margin-left: 20px;" onclick="delete_img({{ $image->id }})" href ="javascript:void(0)"><span style="color:red; font-size: 1.50em;"><i class="fa fa-trash pull-right" aria-hidden="true"></i></span></td>

              <a href="#">
                <tr>
                 <td><img src="/{{$image->path}}" width="100%" height="180px" width="150px" > </td>
                </tr>
               </a>
              <form>
                {{ csrf_field() }}
                <input type="hidden" name="id" value="{{$image->id}}">
                  <div class="form-group">
                    <textarea name="message"style="background-color:skyblue; width:200px" onkeyup="test($(this).closest('form'))" onkeydown="test($(this).closest('form'))"    class="message" rows="2">{{ $image->message }}</textarea>
                  </div>
              </form>
           </div>
        @endforeach
      </div>
    </div>
  </div>
</div>

Delete function with check boxes for multiple files/folders

2 Answers2