Codeigniter 3-Ajax文件上传(您未选择要上传的文件) [英] Codeigniter 3 - Ajax File Upload (You did not select a file to upload)

问题描述

控制器:

function post()
{
    if(!$this->input->is_ajax_request())
    {
        show_404();
        exit;
    }

    $data['result'] = false;

    $config['upload_path']          = base_url().'userfiles/customer';
    $config['allowed_types']        = 'pdf';
    $config['max_size']             = 100000;

    $this->load->library('upload', $config);

    $file = $this->input->post('userfile');

    if ( ! $this->upload->do_upload($file))
    {
        $data['result'] = true;
        $error = array('error' => $this->upload->display_errors());

        $data['error'] = $error;
}
    else
    {
        $data['result'] = true;
        $data_upload = array('upload_data' => $this->upload->data());

        $data['success'] = $data_upload;
    }

    echo json_encode($data);
}

查看:

<div class="form">
    <div class="form-group">
        <label class="form-label" for="package">Package :</label>
        <select class="package form-control" id="package" name="package">
            <option value="none">Please select..</option>
            <?php foreach($package as $row) { ?>
                <option value="<?php echo $row['id_order_package'] ?>"><?php echo $row['name'] ?></option>
            <?php } ?>
        </select>
        <div class="error" id="msg_package"></div>
    </div>
    <div class="form-group">
        <label class="form-label" for="price">Price ( Rp ) :</label>
        <input type="text" class="form-control" name="price" id="price" placeholder="" disabled>
        <div class="error" id="msg_price"></div>
    </div>
    <div class="form-group">
        <label class="form-label" for="days">Days :</label>
        <input type="text" class="form-control" name="days" id="days" placeholder="" disabled>
        <div class="error" id="msg_days"></div>
    </div>
    <div class="form-group">
        <label class="form-label" for="userfile">File :</label>
        <input type="file" id="userfile" name="userfile" class="form-control">
        <div class="error" id="msg_userfile"></div>
    </div>
    <div class="form-group">
        <label class="form-label" for="description">Description :</label>
        <textarea class="form-control" rows="5" name="description" id="description"></textarea>
        <div class="error" id="msg_description"></div>
    </div>
    <div class="form-group center">
        <div class="btn btn-primary">ORDER</div>
    </div>
</div>

JavaScript:

Javascript:

$('.btn').click(function(e){
        $('#msg_package').html(' ');
        $('#msg_userfile').html(' ');
        $('#msg_description').html(' ');

        if($('#package').val() == 'none') {
            $('#msg_package').html('Please select package');
        } else if($('#userfile').val() == '') {
            $('#msg_userfile').html('This field is required');
        } else if($('#description').val() == '') {
            $('#msg_description').html('This field is required');
        } else {

            $.ajax({
                url     : '<?php echo base_url() ?>account_order/add/post',
                type    : 'POST',
                dataType: 'json',
                mimeType:"multipart/form-data",
                processData: false,
                data    : { userfile: $('#userfile')[0].files , price: $('#price').val() , days: $('#days').val() },
                success: function( data ) {

                       if(!data['result']){

                       }else{
                           alert(data['error']);
                       }
                }
            });
        }
    });

但是，我得到一个错误

{"result":true,"error":{"error":"<p>You did not select a file to upload.<\/p>"}}

我试图发布数据& ajax中的文件，但不起作用. 我的问题是如何解决该错误?为什么控制器无法读取用户文件的内容?

I tried to post data & file from ajax, but it doesn't work. My question is how to fix that error? Why the controller can't read userfile's content?

谢谢

推荐答案

尝试将您的输入放入表单中，并提供表单id ='your_form_id'，然后在javascript中通过这种方式发送数据:

try to put your inputs in form and give the form id='your_form_id' then send your data by this way in javascript:

var data = new FormData(document.getElementById("your_form_id"));

然后替换此行data : { userfile: $('#userfile')[0].files , price: $('#price').val() , days: $('#days').val() },

与此data: data,

还要在data: data,之后设置:

async: false,
processData: false,
contentType: false,

这篇关于Codeigniter 3-Ajax文件上传(您未选择要上传的文件)的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！