在 codeigniter 中上传图片有问题
uploading an image in codeigniter trouble
我有教程中的代码,但我不知道我的代码为什么不起作用。我只是按照教程进行操作,代码不起作用。我正在使用 codeigniter 框架,请帮我解决这些问题,我在控制台中也没有错误,我不知道为什么会发生什么。它也不会从 ajax 发送请求。请检查 ajax 中的代码。谢谢。
ajax代码:
$(function () {
var inputFile = $('input[name=file]');
var uploadURI = $('#form-upload').attr('action');
$('#upload-btn').on('click', function(event) {
var fileToUpload = inputFile[0].files[0];
if(fileToUpload != 'undefine') {
var formData = new FormData();
formData.append("file", fileToUpload);
$.ajax({
url: uploadURI,
type: "POST",
data: formData,
processData: false,
contentData: false,
success: function(data) {
alert("Profile picture updated!");
}
});
}
});
});
视角:
<form action="<?php echo site_url("profile/profile_picture") ?>" id="form-upload">
<div class="fileinput fileinput-new input-group" data-provides="fileinput">
<div class="form-control" data-trigger="fileinput"><i class="glyphicon glyphicon-file fileinput-exists"></i> <span class="fileinput-filename"></span></div>
<span class="input-group-addon btn btn-default btn-file"><span class="fileinput-new"><i class="glyphicon glyphicon-paperclip"></i> Select file</span><input type="file" name="file"></span>
<a href="#" id="upload-btn" class="input-group-addon btn btn-success fileinput-exists"><i class="glyphicon glyphicon-open"></i> Upload</a>
</div>
</form>
控制器:
public function profile_picture() {
$config['upload_path'] = "./assets/uploaded_images/";
$config['allowed_types'] = 'gif|jpg|png';
$this->load->library('upload', $config);
if($this->upload->do_upload("file")) {
}
else {
echo "File cannot be uploaded";
}
}
我收到这个错误:
File cannot be uploadedarray(1) {
["error"]=>
string(43) "<p>You did not select a file to upload.</p>"
}
好的问题是它应该是“contentType
”而不是“contentData
”。这是更新的 JS 代码
$(function () {
var inputFile = $('input[name=file]');
var uploadURI = $('#form-upload').attr('action');
$('#upload-btn').on('click', function(event) {
var fileToUpload = inputFile[0].files[0];
if(fileToUpload != 'undefine') {
var formData = new FormData($('#form-upload')[0]);
$.ajax({
type: "POST",
url: uploadURI,
data: formData,
processData: false,
contentType: false,
success: function(msg) {
alert("Profile picture updated!");
}
});
}
});
});
你可以看我的帖子,我给出了使用 ajax 上传多张图片的解决方案,只需从我的解决方案名称中删除数组即可,然后你将在控制器中获取你的图片。
这是我的 link 解决方案。
我有教程中的代码,但我不知道我的代码为什么不起作用。我只是按照教程进行操作,代码不起作用。我正在使用 codeigniter 框架,请帮我解决这些问题,我在控制台中也没有错误,我不知道为什么会发生什么。它也不会从 ajax 发送请求。请检查 ajax 中的代码。谢谢。
ajax代码:
$(function () {
var inputFile = $('input[name=file]');
var uploadURI = $('#form-upload').attr('action');
$('#upload-btn').on('click', function(event) {
var fileToUpload = inputFile[0].files[0];
if(fileToUpload != 'undefine') {
var formData = new FormData();
formData.append("file", fileToUpload);
$.ajax({
url: uploadURI,
type: "POST",
data: formData,
processData: false,
contentData: false,
success: function(data) {
alert("Profile picture updated!");
}
});
}
});
});
视角:
<form action="<?php echo site_url("profile/profile_picture") ?>" id="form-upload">
<div class="fileinput fileinput-new input-group" data-provides="fileinput">
<div class="form-control" data-trigger="fileinput"><i class="glyphicon glyphicon-file fileinput-exists"></i> <span class="fileinput-filename"></span></div>
<span class="input-group-addon btn btn-default btn-file"><span class="fileinput-new"><i class="glyphicon glyphicon-paperclip"></i> Select file</span><input type="file" name="file"></span>
<a href="#" id="upload-btn" class="input-group-addon btn btn-success fileinput-exists"><i class="glyphicon glyphicon-open"></i> Upload</a>
</div>
</form>
控制器:
public function profile_picture() {
$config['upload_path'] = "./assets/uploaded_images/";
$config['allowed_types'] = 'gif|jpg|png';
$this->load->library('upload', $config);
if($this->upload->do_upload("file")) {
}
else {
echo "File cannot be uploaded";
}
}
我收到这个错误:
File cannot be uploadedarray(1) {
["error"]=>
string(43) "<p>You did not select a file to upload.</p>"
}
好的问题是它应该是“contentType
”而不是“contentData
”。这是更新的 JS 代码
$(function () {
var inputFile = $('input[name=file]');
var uploadURI = $('#form-upload').attr('action');
$('#upload-btn').on('click', function(event) {
var fileToUpload = inputFile[0].files[0];
if(fileToUpload != 'undefine') {
var formData = new FormData($('#form-upload')[0]);
$.ajax({
type: "POST",
url: uploadURI,
data: formData,
processData: false,
contentType: false,
success: function(msg) {
alert("Profile picture updated!");
}
});
}
});
});
你可以看我的帖子,我给出了使用 ajax 上传多张图片的解决方案,只需从我的解决方案名称中删除数组即可,然后你将在控制器中获取你的图片。
这是我的 link 解决方案。