我制作并测试了一些代码示例,以便您可以了解问题所在。您有几处错误。我建议的第一件事实际上是使用jQuery。您的代码显然使用的是jQuery,但您可以使用各种可以简化的原始JS:
$(document).ready(function(){ $('#save').on('click', function(){ var fileInput = $('#file_input')[0]; if( fileInput.files.length > 0 ){ var formData = new FormData(); $.each(fileInput.files, function(k,file){ formData.append('images[]', file); }); $.ajax({ method: 'post', url:"/multi_uploader/process", data: formData, dataType: 'json', contentType: false, processdata: false, success: function(response){ console.log(response); } }); }else{ console.log('No Files Selected'); } });});
请注意,我在ajax URL中进行了硬编码。我用于测试的控制器名为Multi_uploader.php。
接下来是在控制器中循环$ _FILES时,需要将其转换为“ userfile”。如果您打算使用CodeIgniter上传类,这是非常重要的:
public function process(){ $F = array(); $count_uploaded_files = count( $_FILES['images']['name'] ); $files = $_FILES; for( $i = 0; $i < $count_uploaded_files; $i++ ) { $_FILES['userfile'] = [ 'name' => $files['images']['name'][$i], 'type' => $files['images']['type'][$i], 'tmp_name' => $files['images']['tmp_name'][$i], 'error' => $files['images']['error'][$i], 'size' => $files['images']['size'][$i] ]; $F[] = $_FILES['userfile']; // Here is where you do your CodeIgniter upload ... } echo json_enpre($F);}
这是我用于测试的视图:
<!doctype html><html><head> <title>Multi Uploader</title> <script src="https://pre.jquery.com/jquery-3.2.1.min.js"></script> <script src="/js/multi_uploader.js"></script></head><body> <form> <input type="file" name="images[]" id="file_input" multiple /> <button type="button" id="save">Upload</button> </form></body></html>
最后,只是为了证明文件已上传到控制器,并且可以将它们与CodeIgniter一起使用,我将ajax响应作为json编码数组发送,并在控制台中显示。请参阅代码注释,您可以在其中放置CodeIgniter上传代码。
更新(以显示如何处理多个文件输入)—如果您要输入多个文件,那么显然会稍微改变您的HTML和JS。在这种情况下,您的HTML将具有多个输入:
<input type="file" name="images[]" multiple /><input type="file" name="images[]" multiple /><input type="file" name="images[]" multiple /><input type="file" name="images[]" multiple />
而且您的javascript需要更改以遍历每个输入:
有关将详细信息添加到数据库的评论的更多信息-$(document).ready(function(){ $('#save').on('click', function(){ var fileInputs = $('.file_input'); var formData = new FormData(); $.each(fileInputs, function(i,fileInput){ if( fileInput.files.length > 0 ){ $.each(fileInput.files, function(k,file){ formData.append('images[]', file); }); } }); $.ajax({ method: 'post', url:"/multi_uploader/process", data: formData, dataType: 'json', contentType: false, processdata: false, success: function(response){ console.log(response); } }); });});
使用CodeIgniter进行上传时,会提供以下上传摘要:
$summary = $this->upload->data();
这是一个数据数组,最终看起来像这样:
$summary = array( 'file_name' => 'mypic.jpg', 'file_type' => 'image/jpeg', 'file_path' => '/path/to/your/upload/', 'full_path' => '/path/to/your/upload/jpg.jpg', 'raw_name' => 'mypic', 'orig_name' => 'mypic.jpg', 'client_name' => 'mypic.jpg', 'file_ext' => '.jpg', 'file_size' => 22.2 'is_image' => 1 'image_width' => 800 'image_height' => 600 'image_type' => 'jpeg', 'image_size_str' => 'width="800" height="200"');
因此,每次上传后,向数据库添加记录所需要做的就是:
$summary = $this->upload->data();$this->db->insert('storefiles', array( 'Store_ID' => $_POST['storeid'], 'File_Name' => $summary['file_name'], 'Created' => date('Y-m-d h:i:s'), 'Modified' => date('Y-m-d h:i:s')));
很容易看出,您可以存储的不仅仅是文件名。
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)