0

我正在异步上传图像，为此我得到了这个很好的教程。我阅读了所有内容并尝试删除我不需要的模型并根据我的需要制作它，但是当我运行它时我没有收到错误并且文件也没有上传。

我在控制器上传功能中放了一个回声，但我也没有得到回声字符串，即使我将完整路径放在 ajaxfileupload URL中。

这是我的看法：

<!doctype html>
<html>
    <head>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
        <script src="<?php echo site_url()?>public/assets/js/ajaxfileupload.js"></script>
        <script>
            $(function() {
                $('#upload_file').submit(function(e) {
                    e.preventDefault();
                    $.ajaxFileUpload({
                        url          : 'upload2/upload_file',
                        secureuri    :  false,
                        fileElementId: 'userfile',
                        dataType     : 'json',
                        data         : {
                                           'title': $('#title').val()
                                       },
                        success : function (data, status)
                        {
                            if(data.status != 'error')
                            {
                                $('#files').html('<p>Reloading files...</p>');
                                refresh_files();
                                $('#title').val('');
                            }
                            alert(data.msg);
                        }
                    });
                    return false;
                });
            });
        </script>
    </head>
    <body>
          <h1>Upload File</h1>
          <form method="post" action="" id="upload_file">
          <label for="title">Title</label>
          <input type="text" name="title" id="title" value="" />

          <label for="userfile">File</label>
          <input type="file" name="userfile" id="userfile" size="20" />

          <input type="submit" name="submit" id="submit" />
          </form>
          <h2>Files</h2>
          <div id="files"></div>
    </body>
</html>

我的控制器是这样的：

<?php
    class Upload2 extends CI_Controller
    {
        public function __construct()
        {
            parent::__construct();

            $this->load->helper('url');
        }

        public function index()
        {
            $this->load->view('upload');
        }
        public function upload_file()
        {
            /* It's not even showing me this echo and the path is
               OK too, and even I put the whole path but no result. */

            echo "in upload_file";
            $status = "";
            $msg = "";
            $file_element_name = 'userfile';

            if (empty($_POST['title']))
            {
                $status = "error";
                $msg = "Please enter a title";
            }

            if ($status != "error")
            {
                $config['upload_path'] = './uploads/';
                $config['allowed_types'] = 'gif|jpg|png|doc|txt';
                $config['max_size']  = 1024 * 8;
                $config['encrypt_name'] = TRUE;

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

                if (!$this->upload->do_upload($file_element_name))
                {
                    $status = 'error';
                    $msg = $this->upload->display_errors('', '');
                }
                else
                {
                    $data = $this->upload->data();
                    $file_id = $this->files_model->insert_file($data['file_name'], $_POST['title']);
                    if($file_id)
                    {
                        $status = "success";
                        $msg = "File successfully uploaded";
                    }
                    else
                    {
                        unlink($data['full_path']);
                        $status = "error";
                        $msg = "Something went wrong when saving the file, please try again.";
                    }
                }
                @unlink($_FILES[$file_element_name]);
            }
            echo json_encode(array('status' => $status, 'msg' => $msg));
        }
    }
?>
4

2 回答 2

0

将此属性添加到您的表单enctype="multipart/form-data"

于 2013-04-05T11:20:47.840 回答
0

这在没有任何插件或外部脚本的情况下是可行的。您需要文件上传元素、将数据返回到的 iFrame 和简单的 Ajax 脚本。

文件上传元素：

echo '<input type="file" name="prodImageUpload"
id="prodImageUpload" onchange="return ajaxFileUpload(this);"/>'

框架：

<iframe name="upload_iframe" id="upload_iframe" style="display:block;width:720px;"></iframe>

JavaScript 脚本：

function ajaxFileUpload(upload_field)
{
    var re_text = /\.jpg|\.gif|\.jpeg|\.png/i;
    var filename = upload_field.value;
    var imagename = filename.replace("C:\\fakepath\\","");
    if (filename.search(re_text) == -1)
    {
        alert("File must be an image");
        upload_field.form.reset();
        return false;
    }
    upload_field.form.action = "addProductImage";
    upload_field.form.target = "upload_iframe";
    upload_field.form.submit();
    upload_field.form.action = "";
    upload_field.form.target = "";
    return true;
}

在我的控制器中，我有一个自定义上传，但这无关紧要。您需要做的就是通过上传控件名称和最终路径。如果有任何错误，我会回显错误，或者如果可以打印到 iFrame，则返回文件名和大小。它非常简单并且工作正常。

于 2013-04-05T11:29:50.327 回答