Upload image with ajax and remove or add more image

Sorry for english , im searching  a tutorial to add and remove img with codeigniter and ajax.

Sorry for english , im searching  a tutorial to add and remove img with codeigniter and ajax.

Hi , i try to modify a script this is the html :

Code:

<input  type='file'    id='file'  class='form-control g-color-black g-bg-white g-bg-white--focus g-brd-gray-light-v4 g-brd-primary--hover rounded-3 g-py-13 g-px-15' name='file'   />

 <input type="button" class="button" value="Upload" id="but_upload">


  </div>
</div>

<div class="uploaded_images"></div>

This is the jquery code:

Code:

$("#but_upload").click(function(){

     var fd = new FormData();
     var files = $('#file')[0].files[0];
     fd.append('file',files);
     fd.append('request',1);

     // AJAX request
     $.ajax({
      url: '<?= base_url() ?>index.php/lavori/ajax_upload',
      type: 'post',
      data: fd,
      contentType: false,
      processData: false,
      success: function(response){
        if(response != 0){
          var count = $('.uploaded_images .content').length;
          count = Number(count) + 1;

          // Show image preview with Delete button
          $('.uploaded_images').append("<div class='content' id='content_"+count+"' ><img src='"+response+"' width='100' height='100'><button class='delete' id='delete_"+count+"'>Delete</button></div>");
        }else{
          alert('file not uploaded');
        }
      }
     });
    });

    // Remove file
    $('.uploaded_images').on('click','.content .delete',function(){
   
     var id = this.id;
     var split_id = id.split('_');
     var num = split_id[1];

     // Get image source
     var imgElement_src = $( '#content_'+num+' img' ).attr("src");
   
     // AJAX request
     $.ajax({
      url: '<?= base_url() ?>index.php/lavori/ajax_upload',
      type: 'post',
      data: {path: imgElement_src,request: 2},
      success: function(response){
       // Remove <div >
       if(response == 1){
        $('#content_'+num).remove();
       }
      }
     });
    });

And this the function to upload/delete :

PHP Code:

function ajax_upload(){  
           

    $request = $_POST['request'];

    // Upload file
    if($request == 1){
         $filename = time().$_FILES['file']['name'];
        /* Location */
        $location = site_url().'uploads/'.$filename;
      
        $config['upload_path']   = './uploads/';  
        $config['allowed_types'] = 'jpg|jpeg|png|gif';  
        $config['file_name']     = time().$_FILES["file"]["name"];

        $this->load->library('upload', $config);  
                    

         if(!$this->upload->do_upload('file')){  
            echo $this->upload->display_errors();  
          }else{  
            $data = $this->upload->data();  
            echo base_url().'uploads/'.$data["file_name"]; 

          }  
        exit;
    }

    // Remove file
    if($request == 2){

        $path = $_POST['path'];
        $return_text = 0;

        // Check file exist or not
        if( file_exists($path) ){
         // Remove file
         unlink($path);
         
         // Set status
         $return_text = 1;
        }else{
         // Set status
         $return_text = 0;
        }

        // Return status
        echo $return_text;
        exit;
    }


  }   


The upload work fine but the delete dont work . Can someone helpme