Michael Nio
Michael Nio

Reputation: 1

How to upload ajax file with codeignitier

im trying to upload image in codeignitier using ajax the problem is in ajax won't send any data to the controller
here is my code:

$("#file-input").change(function(e) {
        $.ajax({			
            url: "<?php echo base_url(); ?>ControllerEditor/uploadImageUserAjax",
			type: "POST",
			data:  new FormData(this),
			mimeType:"multipart/form-data",
            contentType: false,
            cache: false,
            processData:false,
            success: function(data)
            {
				if(data)
				{
					console.log(data);
				}
//            $("#targetLayer").html(data);
            },
            error: function() 
            {
            }           
       });//end ajax
    }); //end submit
<form id="form-uploadImage" action="ControllerEditor/uploadImageUserAjax" method="post" enctype="multipart/form-data">
<div class="image-upload">
<label for="file-input">
<img src="asset/globalimage/addIcon.png"/>
</label>
<input id="file-input" name='file-input' type="file"/><br>
Add Image
</div>
</form>

Upvotes: 0

Views: 48

Answers (2)

user6412824
user6412824

Reputation:

you can try this!hope it's help to you

<form enctype="multipart/form-data" accept-charset="utf-8" name="formname" id="formname"  method="post" action="">
<div class="image-upload">
<label for="file-input">
<img src="asset/globalimage/addIcon.png"/>
</label>
<input id="file-input" name='file-input' type="file"/><br>
Add Image
</div>
</form>



function uploadImage() {

    if (typeof FormData !== 'undefined') {

        // send the formData
        var formData = new FormData( $("#formID")[0] );

        $.ajax({
            url : baseUrl + 'uploadImage',  // Controller URL
            type : 'POST',
            data : formData,
            async : false,
            cache : false,
            contentType : false,
            processData : false,
            success : function(data) {
                successFunction(data);
            }
        });

    } else {
       message("Your Browser Don't support FormData API! Use IE 10 or Above!");
    }   
}

Upvotes: 0

Harsh Doshi
Harsh Doshi

Reputation: 96

Replace below code

data:  new FormData(this),

with the

data : new FormData($('#form-uploadImage')[0]),  

I hope this will help you.

thank you.

Upvotes: 1

Related Questions