如何使用Codeigniter插入和移动多个图像？

Question

视图：

<script>
    $(document).ready(function(){
        $("#submit").click(function(e){
            e.preventDefault();
            product_name = $("#product_name").val();
            color = $("#colorWell").val();
            $.ajax({
                type:"POST",
                data:{"product_name":product_name, "color":color},
                url:"<?php echo base_url(); ?>admin/products",
                success:function(data){
                    alert(data);
                }
            });
        });
    });
</script>

<input type="text" class="form-control" id="product_name" name="product_name">
<input type="color" id="colorWell" name="color">
<input type="file" id="product_image" name="product_image[]" multiple>
<input type="submit" class="btn btn-primary" id="submit" name="submit">

控制器：

public function products()
{
    $product_name = $this->input->post('product_name');
    $color = $this->input->post('color');

    $dataInfo = array();
    $files = $_FILES;
    $cpt = count($_FILES['product_image']['name']);
    for($i=0; $i<$cpt; $i++)
    {           
        $_FILES['product_image']['name']= $files['product_image']['name'][$i];
        $_FILES['product_image']['type']= $files['product_image']['type'][$i];
        $_FILES['product_image']['tmp_name']= $files['product_image']['tmp_name'][$i];
        $_FILES['product_image']['error']= $files['product_image']['error'][$i];
        $_FILES['product_image']['size']= $files['product_image']['size'][$i];    

        $this->upload->initialize($this->set_upload_options());
        $this->upload->do_upload();
        $dataInfo[] = $this->upload->data();
    }
    $data = array(
            'product_name' => $product_name,
            'color' => $color,
            'product_image' => implode(",",$dataInfo['product_image']),
        );
    $result_set = $this->db->insert('add_product',$data);
    if($sql == true)
    {
        echo 'New Product Added';
    }
    else
    {
        echo 'Unable to Proceed!';
    }
}

private function set_upload_options()
{   
    $config = array();
    $config['upload_path'] = ''.base_url().'resource/product/';
    $config['allowed_types'] = 'gif|jpg|png';
    $config['max_size']      = '0';
    $config['overwrite']     = FALSE;
    return $config;
}

在这段代码中，我尝试插入并且想要将图像移动到文件夹中。 但是现在的问题是，当我单击“提交”按钮时，它会引发错误，如下所示：

Message: Undefined index: product_image

和查询外观：

INSERT INTO `product` (`product_name`, `color`, `product_image`) VALUES ('men hoodies','#004080', NULL)

我不知道我在哪里做错了。 那么，我该如何解决这个问题？ 请帮我。

谢谢

Answer 1

在ajax中发送带有文件的所有formdata。

像这样的HTML代码...

<form method="POST" id="YourFormID" enctype="multipart/form-data">
<input type="text" class="form-control" id="product_name" name="product_name">
<input type="color" id="colorWell" name="color">
<input type="file" id="product_image" name="product_image[]" multiple>
<input type="submit" class="btn btn-primary" id="submit" name="submit">
</form>

Ajax代码在这里。

<script type="text/javascript">
$(document).ready(function(){
    $("#submit").click(function(e){
        e.preventDefault();
        var formData = new FormData($('form#YourFormID')[0]);
        $.ajax({
            type:"POST",
            data:formData,
            url:"<?php echo base_url(); ?>admin/products",
            success:function(data){
                alert(data);
            }
        });
    });
});
</script>

您没有在ajax请求中发送文件。 因此找不到索引product_image

Answer 2

使用如下所示的array_column添加获取所有product_image值

implode(",",array_column($dataInfo, 'product_image'))

Answer 3

您没有提交文件数据。 使用formData上传文件数据，并将您想要添加的其他任何输入追加到formData ：

<script>
    $(document).ready(function(){
        $("#submit").click(function(e){
            e.preventDefault();
            product_name = $("#product_name").val();
            color = $("#colorWell").val();
            var formData = new FormData();
            $.each($("#product_image"), function (i, obj) {
                $.each(obj.files, function (j, file) {                    
                    formData.append('product_image[' + i + ']', file);
                });
            });
            formData.append('product_name', product_name);
            formData.append('color', color);
            $.ajax({
                type:"POST",
                data:formData,
                processData: false,
                contentType: false,
                url:"<?php echo base_url(); ?>admin/products",
                success:function(data){
                    alert(data);
                }
            });
        });
    });
</script>