如何使用ajax从CodeIgniter中的动态生成表单上传图像

时间:2021-11-10 09:05:51

I want to upload an image to a local folder using jquery ajax. The complex part is i have the forms which are generated dynamically, and to those forms and fields i am giving the id to it so as to show which form is submitted as shown below. I am using following code but the image is not uploaded.

我想使用jquery ajax将图像上传到本地文件夹。复杂的部分是我有动态生成的表单,以及我给它的id的那些表单和字段,以便显示提交的表单,如下所示。我正在使用以下代码,但图片未上传。

View: Upload_View.php

查看:Upload_View.php

<script type="text/javascript">
    function sendVideoData(frm_id)
    {    
        var data = new FormData(document.getElementById("post_video_"+frm_id));
        // make the AJAX request
        jQuery.ajax({
            type: "POST",
            url: "<?php echo base_url(); ?>"+"dashboard/do_upload",
            data: data+'&form_id='+frm_id,
            mimeType:"multipart/form-data",
            contentType: false,
            cache: false,
            processData:false,
            dataType: 'json',
            success: function (data) {
                alert("data"+data);
            },            
        });        
        return false;
    }
</script>

<form name="post_video" id="post_video_<?=$row1['id']?>" method="post" onsubmit="return sendVideoData(<?=$row1['id']?>)">           
    <input type="file" name="save_movie_<?=$row1['id']?>" id="movie_<?=$row1['id']?>" /> 
    <input name="type_lecture_id" class="get_lecture_id" id="get_lecture_id_<?=$row1['id']?>" value="<?=$row1['id']?>" type="hidden"/>
    <input type="button" class="postbtn" id="submit_movie_<?=$row1['id']?>" value="Upload Video File"/>
</form>

Controller:

控制器:

$formid=$_POST['form_id']; 

$filename='save_movie_'.$formid;
$path_parts = pathinfo($_FILES[$filename]["name"]);
$extension = $path_parts['extension'];
$Random_file_name=$filename.".".$extension;
move_uploaded_file($_FILES[$filename]['tmp_name'], "http://localhost/dummy/uploads/".$Random_file_name);

save_movie_ this is the id of the file control and $formid shows from which form and which field we have to take data, but because i am new to Codeigniter i don't know from how to upload it. One thing more i want to display progress bar also to display the progress of image upload.Please reply. Thanks...

save_movie_这是文件控件的id,$ formid显示我们从哪个表单和哪个字段获取数据,但因为我是Codeigniter的新手,我不知道如何上传它。还有一件事我想显示进度条也显示图片上传的进度。请回复。谢谢...

1 个解决方案

#1


5  

You must have to modify your jQuery ajax function in the following way

您必须以下列方式修改jQuery ajax函数

   var data = new FormData(document.getElementById("post_video_"+frm_id)[0]);
   jQuery("#progressbar").show(); // add your prgress bar here like this
   jQuery.ajax({
        type: "POST",
        url: "<?php echo base_url(); ?>"+"dashboard/do_upload",
        data: data+'&form_id='+frm_id,
        mimeType:"multipart/form-data",
        contentType: false,
        async: false,
        cache: false,
        processData:false,
        dataType: 'json',
        success: function (data) {
            alert("data"+data);
            jQuery("#progressbar").hide(); //hide your loader like this
        },            
    });        
    return false;

Thank You.

谢谢。

#1


5  

You must have to modify your jQuery ajax function in the following way

您必须以下列方式修改jQuery ajax函数

   var data = new FormData(document.getElementById("post_video_"+frm_id)[0]);
   jQuery("#progressbar").show(); // add your prgress bar here like this
   jQuery.ajax({
        type: "POST",
        url: "<?php echo base_url(); ?>"+"dashboard/do_upload",
        data: data+'&form_id='+frm_id,
        mimeType:"multipart/form-data",
        contentType: false,
        async: false,
        cache: false,
        processData:false,
        dataType: 'json',
        success: function (data) {
            alert("data"+data);
            jQuery("#progressbar").hide(); //hide your loader like this
        },            
    });        
    return false;

Thank You.

谢谢。