[英]How to upload file in laravel with formData in jquery ajax
[英]Retrieve formData from jQuery File Upload
我很想嘗試在jQuery File Upload插件中提交其他表單數據。 它在這里進行了描述https://github.com/blueimp/jQuery-File-Upload/wiki/How-to-submit-additional-Form-Data,但是沒有詳細介紹如何檢索和使用該數據在UploadHandler.php中。 以下是我所擁有的:
index.php(形式):
<form id="fileupload" action="<?php echo $this->config->item('base_url'); ?>/cool_upload/server/php/" method="POST" enctype="multipart/form-data">
<input type="hidden" id="userID" value="<?php echo $this->session->userdata('id'); ?>">
<!-- The fileupload-buttonbar contains buttons to add/delete files and start/cancel the upload -->
<div class="row fileupload-buttonbar">
<div class="span7">
<!-- The fileinput-button span is used to style the file input field as button -->
<span class="btn btn-success fileinput-button">
<i class="icon-plus icon-white"></i>
<span>Add files...</span>
<!-- REMOVED MULTIPLE FROM HERE TO ONLY ALLOW ONE FILE AT A TIME!!!! -->
<input type="file" name="files[]">
</span>
<button type="submit" class="btn btn-primary start">
<i class="icon-upload icon-white"></i>
<span>Start upload</span>
</button>
<button type="reset" class="btn btn-warning cancel">
<i class="icon-ban-circle icon-white"></i>
<span>Cancel upload</span>
</button>
<button type="button" class="btn btn-danger delete">
<i class="icon-trash icon-white"></i>
<span>Delete</span>
</button>
<input type="checkbox" class="toggle">
</div>
</div>
<!-- The global progress information -->
<div class="span5 fileupload-progress fade">
<!-- The global progress bar -->
<div class="progress progress-success progress-striped active" role="progressbar" aria-valuemin="0" aria-valuemax="100">
<div class="bar" style="width:200%;"></div>
</div>
<!-- The extended global progress information -->
<div class="progress-extended"> </div>
</div>
<!-- The loading indicator is shown during file processing -->
<div class="fileupload-loading"></div>
<br>
<!-- The table listing the files available for upload/download -->
<table role="presentation" class="table table-striped"><tbody class="files" data-toggle="modal-gallery" data-target="#modal-gallery"></tbody></table>
</form>
<br>
<!-- The template to display files available for upload -->
<script id="template-upload" type="text/x-tmpl">
<tr class="template-upload fade">
<td colspan="2" class="preview"><span class="fade"></span></td>
<td class="changeFileName"><input type="text" name="changeFileName" class="changeFileName" style="width: 110px;" placeholder="New File Name?" maxlength="25" />
<select class="selectCat" name="selectCategory" style="width: 130px;">
<option selected="selected" value="0">Select Category:</option>
<?php
foreach ($fileCategory as $t)
{
echo '<option value="'.$t['id'].'">'.$t['name'].'</option>';
}
?>
<option value="3">Other...</option>
</select>
</td>
<td colspan="2" class="name" width="20"><span>{%=file.name%}</span></td>
<td colspan="2" class="size"><span>{%=o.formatFileSize(file.size)%}</span></td>
{% if (file.error) { %}
<td class="error" colspan="2"><span class="label label-important">Error</span> {%=file.error%}</td>
{% } else if (o.files.valid && !i) { %}
<td>
<div class="progress progress-success progress-striped active" role="progressbar" aria-valuemin="0" aria-valuemax="100" aria-valuenow="0"><div class="bar" style="width:0%;"></div></div>
</td>
<td class="start">{% if (!o.options.autoUpload) { %}
<button class="btn btn-primary">
<i class="icon-upload icon-white"></i>
<span>Start</span>
</button>
{% } %}</td>
{% } else { %}
<td colspan="2"></td>
{% } %}
<td class="cancel">{% if (!i) { %}
<button class="btn btn-warning">
<i class="icon-ban-circle icon-white"></i>
<span>Cancel</span>
</button>
{% } %}</td>
<td rowspan="2"></td>
</tr>
{% } %}
</script>
main.js:
$('#fileupload').bind('fileuploadsubmit', function (e, data) {
data.formData = $('form').serializeArray();
});
UploadHandler.php:
-這是我對發布功能的編輯:
public function post($print_response = true) {
if (isset($_REQUEST['_method']) && $_REQUEST['_method'] === 'DELETE') {
return $this->delete($print_response);
}
$upload = isset($_FILES[$this->options['param_name']]) ?
$_FILES[$this->options['param_name']] : null;
// Parse the Content-Disposition header, if available:
$file_name = isset($_SERVER['HTTP_CONTENT_DISPOSITION']) ?
rawurldecode(preg_replace(
'/(^[^"]+")|("$)/',
'',
$_SERVER['HTTP_CONTENT_DISPOSITION']
)) : null;
// Parse the Content-Range header, which has the following form:
// Content-Range: bytes 0-524287/2000000
$content_range = isset($_SERVER['HTTP_CONTENT_RANGE']) ?
preg_split('/[^0-9]+/', $_SERVER['HTTP_CONTENT_RANGE']) : null;
$size = $content_range ? $content_range[3] : null;
$files = array();
// IF THERE ARE MULTIPLE FILES
if ($upload && is_array($upload['tmp_name'])) {
// param_name is an array identifier like "files[]",
// $_FILES is a multi-dimensional array:
foreach ($upload['tmp_name'] as $index => $value) {
$files[] = $this->handle_file_upload(
$upload['tmp_name'][$index],
$file_name ? $file_name : $upload['name'][$index],
$size ? $size : $upload['size'][$index],
$upload['type'][$index],
$upload['error'][$index],
$index,
$content_range,
isset($_REQUEST['userID']) ? $_REQUEST['userID'] : null,
null
);
}
} else {
// param_name is a single object identifier like "file",
// $_FILES is a one-dimensional array:
$files[] = $this->handle_file_upload(
isset($upload['tmp_name']) ? $upload['tmp_name'] : null,
$file_name ? $file_name : (isset($upload['name']) ?
$upload['name'] : null),
$size ? $size : (isset($upload['size']) ?
$upload['size'] : $_SERVER['CONTENT_LENGTH']),
isset($upload['type']) ?
$upload['type'] : $_SERVER['CONTENT_TYPE'],
isset($upload['error']) ? $upload['error'] : null,
null,
$content_range,
isset($_REQUEST['userID']) ? $_REQUEST['userID'] : null,
null
);
}
return $this->generate_response(array('files' => $files), $print_response);
}
-我將參數添加到handle_file_upload
protected function handle_file_upload($uploaded_file, $name, $size, $type, $error,
$index = null, $content_range = null, $userID) {
當我嘗試使用$ userID時,我什么也沒得到,因為它是空的。 如何使用表單中的userID? 同樣在index.php中,如何在模板顯示區域中使用這些添加的輸入呢? 例如,我有一個changeFilerName的輸入和一個選擇類別的選擇。 我已經閱讀了文檔,但是我仍然不確定如何將事物傳遞給UploadHandler。
首先,通過查看頁面源,確保在隱藏的表單字段中填充了$ userID。 隱藏的表單字段需要這樣的名稱:
<input name="userID" id="userID" ....
在PHP方面,該輸入的值將在$ _POST數組中可用
$_POST['userid']
您還應該在瀏覽器或諸如Firebug之類的工具附帶的開發人員工具控制台中觀察Ajax請求的請求/響應。
嘗試使用此插件上傳大量文件。 它具有自動支持功能,可檢測瀏覽器是否支持html5或Flash或Java
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.