Php Codeigniter 3中的Ajax图像上载错误

您好，我正在使用CodeIgniter3和jQueryAjax

我正在使用内置的上传库

我想在我的服务器上上载图像，但始终会收到以下错误消息：

您没有选择要上载的文件

这是我的密码

查看

<?php echo form_open_multipart('settings/uploadprofilephoto', array('id' => 'upload-avatar-form'));?>
<!-- Modal -->
<div id="myModal" class="modal fade" role="dialog">
    <div class="modal-dialog">
        <!-- Modal content-->
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">&times;</button>
                <h4 class="modal-title">Upload profile photo</h4>
            </div>
            <div class="modal-body">
            </div>
            <div class="modal-footer">
                <div class="row">
                    <div class="form-group col-md-6">
                            <input type="file" name="profilephoto" id="profile-photo" class="form-control">
                    </div>
                    <div class="form-group col-md-6">
                        <button type="submit" id="upload" class="btn btn-success">Upload</button>
                        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- Modal -->
<?php echo form_close();?>

ajax

/* 
Upload profile photo
*/
$("#upload-avatar-form").submit(function(event){
    $.post(base_url + "settings/uploadprofilephoto" , $(this).serialize(), function(data){
        console.log(data);
       //alert("ok");
    });
    event.preventDefault();
});

我哪里错了？

serialize（）

不会在其中传递图像。它不适用于多部分formdata

而是像这样使用：

var formData=新的formData（本）

传递此formData变量，而不是
$（this）。序列化（）
尝试此操作

$('#button_name').on('click', function(event) { 

    event.preventDefault();

    $.ajax({
        url: "<?php echo base_url('settings/uploadprofilephoto');?>",
        type: 'post',       
        dataType: 'json',
        data: new FormData(this),
        cache: false,
        contentType: false,
        processData: false,     
        success: function(json) {
            // Success Stuff
        },          
    });
}); 

$（'#按钮_名称'）。在（'click'，函数（事件）{
event.preventDefault（）；
$.ajax({
url:“”，
键入：“post”，
数据类型：“json”，
数据：新表单数据（本），
cache:false，
contentType:false，
processData:false，
成功：函数（json）{
//成功的东西
},          
});
}); 

在视图部分

<button type="button" id="button_name">Upload</button>

上传
你必须试试这个

$('#logo_form').on('submit',function(form){
                   form.preventDefault(); 
                   var me = $(this);

                   var file_data = $('#file').prop('files')[0];
                    var form_data = new FormData();
                    form_data.append('file', file_data);
                    $.ajax({
                        url: me.attr('action'), // point to server-side controller method
                        dataType: 'text', // what to expect back from the server
                        cache: false,
                        contentType: false,
                        processData: false,
                        data: form_data,
                        type: 'post',
                        success: function (response) {
                            $("#logo_form")[0].reset();
                            $('#logo_success').html(response); // display success response from the server
                            window.setTimeout(function(){location.reload()},1000);
                        },
                        error: function (response) {
                            $('#error').html(response); // display error response from the server
                        }
                    });
                });

请检查下面提到的解决方案，这将帮助您发送带有输入数据的文件


var myFormData=new FormData（）；
$（文档）。在（“单击”，“按钮”，功能（e）{
e、 预防默认值（）；
变量输入=$（“#我的表单输入[type=“file”]”）；
$。每个（输入、功能（obj、v）{
var file=v.files[0]；
var filename=$（v）.attr（“数据文件名”）；
变量名称=$（v）.attr（“id”）；
追加（名称、文件、文件名）；
});
变量输入=$（“#我的表格输入[type=“text”]”）；
$。每个（输入、功能（obj、v）{
变量名称=$（v）.attr（“id”）；
var值=$（v）.val（）；
追加（名称、值）；
});
var xhr=新的XMLHttpRequest；
open（'POST'，'/echo/html/'，true）；
发送（myFormData）；
});









提交
嘿，@djuro-djuria，希望这能解决你的问题。
$('#logo_form').on('submit',function(form){
                   form.preventDefault(); 
                   var me = $(this);

                   var file_data = $('#file').prop('files')[0];
                    var form_data = new FormData();
                    form_data.append('file', file_data);
                    $.ajax({
                        url: me.attr('action'), // point to server-side controller method
                        dataType: 'text', // what to expect back from the server
                        cache: false,
                        contentType: false,
                        processData: false,
                        data: form_data,
                        type: 'post',
                        success: function (response) {
                            $("#logo_form")[0].reset();
                            $('#logo_success').html(response); // display success response from the server
                            window.setTimeout(function(){location.reload()},1000);
                        },
                        error: function (response) {
                            $('#error').html(response); // display error response from the server
                        }
                    });
                });