PHP - 使用json的Codeigniter驗證

Question

我有一個字段，每個字段都有一個驗證。所有的驗證工作。

但問題是在我的領域，將上傳文件。即使我已經把一個圖像文件仍然會驗證我必須上傳圖像。

即時通訊使用sweetalert來顯示驗證錯誤。

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

該文件沒有像這樣通過ajax，所以$ _FILES是空的，CI沒有看到。您可以傳輸文件而無需使用FormData對象重新加載頁面。閱讀更多關於this question。還要注意瀏覽器的兼容性，因爲這個API適用於現代瀏覽器和ie10 +。

我通常用jquery插件來做這件事。有許多。其中最流行的是https://github.com/blueimp/jQuery-File-Upload，其它例如：http://malsup.com/jquery/form/#file-upload

Answer 2

使用FORMDATA而不是連載上傳的文件，雖然我警告它並不適用於IE9工作，下面，你可以閱讀更多關於FORMDATA here。

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

// Create a new FormData with your form selector inside. 

var formdata = new FormData($('form')[0]); 

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

    data:formdata, 
    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(); 
});