我正在尝试在laravel项目中使用dropzone,但我无法在服务器端获取文件。
我的刀片HTML代码:
{!! Form::open(['id' => 'create-intervention-form', 'url' => '/create-intervention', 'method' => 'post', 'class' => '']) !!}
<div id="multimedia" class="data new dropzone">
</div>
<div class="btn-new-bottom">
<a href="#new-intervention">Criar Intervenção</a>
</div>
{!! Form::close() !!}
在jquery中我把这段代码:
$("div#multimedia").dropzone({
url: "/create-intervention",
paramName: "file", // The name that will be used to transfer the file
maxFilesize: 1024,
autoProcessQueue: false
});
要提交表单,我有一个jquery函数要提交。在控制器中,我尝试获取$files[] = Input::file('file');
,但这将返回null。
控制器:
public function store(Request $request)
{
$rules = array(
);
// do the validation ----------------------------------
// validate against the inputs from our form
$validator = Validator::make(Input::all(), $rules);
// check if the validator failed -----------------------
if ($validator->fails())
{
// get the error messages from the validator
$messages = $validator->messages();
return redirect()->back()->withErrors($validator)->withInput();
}
else
{
$files[] = Input::file('file');
var_dump($files);
}
};
我该怎么做?我想使用dropzone上传多个文件,但只是在我提交表单时。在控制器中,我必须将每个文件保存在数据库中的目录和文件名中。
谢谢
答案 0 :(得分:0)
您可以尝试在循环中获取被认为是Request的文件:
控制器:
public function store(Request $request)
{
$rules = array();
// do the validation ----------------------------------
// validate against the inputs from our form
$validator = Validator::make(Input::all(), $rules);
// check if the validator failed -----------------------
if ($validator->fails())
{
// get the error messages from the validator
$messages = $validator->messages();
return redirect()->back()->withErrors($validator)->withInput();
}
else
{
foreach( $request->file('file') as $file ){
$filename = $file->store('file');
#saves the file
$array_images_names[] = $filename;
}
var_dump($files);
}
};
JavaScript(允许接受多个文件)
var post_url_images = $('#post_url_images').val();
Dropzone.options.frm_drop_images = {
paramName: "file", // The name that will be used to transfer the file
maxFilesize: 1024,
// The configuration we've talked about above
url: post_url_images,
autoProcessQueue: false,
uploadMultiple: true,
parallelUploads: 100,
maxFiles: 100,
// The setting up of the dropzone
init: function() {
var myDropzone = this;
// First change the button to actually tell Dropzone to process the queue.
this.element.querySelector("button[type=submit]").addEventListener("click", function(e) {
// Make sure that the form isn't actually being sent.
e.preventDefault();
e.stopPropagation();
myDropzone.processQueue();
});
// Listen to the sendingmultiple event. In this case, it's the sendingmultiple event instead
// of the sending event because uploadMultiple is set to true.
this.on("sendingmultiple", function() {
// Gets triggered when the form is actually being sent.
// Hide the success button or the complete form.
});
this.on("successmultiple", function(files, response) {
// Gets triggered when the files have successfully been sent.
// Redirect user or notify of success.
});
this.on("errormultiple", function(files, response) {
// Gets triggered when there was an error sending the files.
// Maybe show form again, and notify user of error
});
}
};
尝试使用您的HTML表单,如下所示:
<div class="dropzone dropzone-previews" id="frm_drop_images" class="dropzone" method="post" action="{{ url('/admin/products/upload/image') }}"></div>
<!-- hiddent field to set where to post the images -->
<input type="hidden" name="post_url_images" id="post_url_images" value="{{ url('/create-intervention') }}" >
<div class="btn-new-bottom">
<a href="#new-intervention">Criar Intervenção (Não precisa usar este botão)</a>
</div>
答案 1 :(得分:0)
将表单添加到表单中{1}}