PHP - 使用json进行Codeigniter验证

Question

I have a fields and every field have a validation. all validation are working.

But the problem is in my field that will upload file. Even though i already put an image file still it will validate that I must upload an image.

im using sweetalert to show the validation errors.

MY CONTROLLER

public function saveproducts(){
    $config['upload_path'] = 'uploads/products';   
    $config['allowed_types'] = 'jpg|png|jpeg';
    $config['max_size'] = '2048000';
    $config['overwrite'] = TRUE;
    //$config['file_name'] = $this->input->post('prod_name');

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

    $this->form_validation->set_rules('userfile', 'Product Image','callback_rulesprodimage');

    if($this->form_validation->run()==FALSE){
        echo json_encode(validation_errors());
    }else{

        $products = array(
            'product_image' => $this->input->post('userfile'),
            'upload_data' => $this->upload->data(),
            );

        $this->CrudModel->insertproductdata($products);

        echo json_encode(1);
    }

}

public function rulesprodimage(){
    if (isset($_FILES['userfile']) && !empty($_FILES['userfile']['name'])){
        if ($this->upload->do_upload('userfile')){
        return true;
        }else{
        $this->form_validation->set_message('rulesprodimage', $this->upload->display_errors());
        return false;
        }
    }else{
      // throw an error because nothing was uploaded
      $this->form_validation->set_message('rulesprodimage', "You must upload an image!");
      return false;
    }
}

VIEW

<form method="post" enctype="multipart/form-data" id="prod-submit">
<div class="form-group">
<label class="control-label">Product Image <span id="required"> * </span></label>
<input type="file" name="userfile" class="form-control">
</div>
</form>

Javascript

$(document).ready(function(){
$('#prod-submit').on('submit',function(e) { 

$.ajax({
    url: base_url+'adminpage/saveproducts/',

    data:$(this).serialize(),
    type:'POST',
    success:function(data){

      var result = JSON.parse(data); 
        if(result===1){ 
            console.log(result);
            document.location.href = base_url+"adminpage/products/"
        }
        else{
           swal({
                type: 'error',
                html: result,

              }).done();
        }
    },
    error:function(data){
    swal("Oops...", "Something went wrong :(", "error");

    }
  });
  e.preventDefault(); 
});

});

Answer 1

The file doesn't go through ajax just like that, so $_FILES is empty and CI doesn't see. You can transport file without page reloading with FormData object. Read more on this question. Watch out also on browser compatibility, because this api works on modern browsers and ie10+.

I usually do this with jquery plugins. There are many. One of the most popular is https://github.com/blueimp/jQuery-File-Upload , other for example: http://malsup.com/jquery/form/#file-upload