Image Upload in PHP using AJAX Jquery not working

Vishal Kumar

I have a form with 4 text fields and one image file. I have to upload it via AJAX call. After working for 2 days... I have made it working ..however there is an issue

<script type="text/javascript">
$(document).ready(function(){

// Variable to store your files
var files;
// Add events
$('input[type=file]').on('change', prepareUpload);
// Grab the files and set them to our variable
function prepareUpload(event)
{
  files = event.target.files;
  //alert(files);
}


$("#myProfileForm").submit(function(event){
    event.preventDefault();
    document.getElementById("messageBlock").style.display = 'none';
    // Serialize the form data.
    var form = $('#myProfileForm');
    var formData = $(form).serialize();

    // Submit the form using AJAX.
$.ajax({
    type: 'POST',
    dataType: 'json',
    processData: false, 
    contentType: false, 
    url: $(form).attr('action')+'?'+files,
    data: formData
    alert(url);
}).done(function(response) {
    var formMessages = $('#form-messages');

    if(response.error){
        document.getElementById("messageBlock").style.display = 'block';
        $(formMessages).html(response.message);
    }else{
        document.getElementById("messageBlock").style.display = 'block';
        $(formMessages).html(response.message);
    }
})
}); 
});
</script>

My PHP file code:

if (isset($_FILES['image_url'])){
$name       = $_FILES['image_url']['name'];  
$image_url = $name;
$temp_name  = $_FILES['image_url']['tmp_name'];  
if(isset($name)){
if(!empty($name)){      
    $location = 'uploads/';      
    if(move_uploaded_file($temp_name, $location.$name)){
    //echo 'File uploaded successfully';
            $image_url = UPLOADED_IMG_URL.''.$location.''.$name;
    }
}       
}  else {
$image_url = DEFAULT_IMAGE;
}
}else {
$image_url = '../../API/v1/uploads/default.PNG';
}

The PHP code works well. The issue is with the AJAX call. When I comment the //alert(url);

Things stop working as if (isset($_FILES['image_url'])) returns false. Not sure..what is causing the issue.

SJB

serialize() would not work with multipart data ,instead, you should use Formdata() method. check out this stack question; also remove that alert from $.ajax ; you cant do that.

Collected from the Internet

Please contact [email protected] to delete if infringement.

edited at
0

Comments

0 comments
Login to comment

Related

From Dev

Image Upload in PHP using AJAX Jquery not working

From Dev

Upload multiple image using AJAX, PHP and jQuery

From Dev

PHP and jQuery with AJAX upload not working

From Dev

Update Image from database using ajax, jquery,and PHP not working

From Dev

Update Image from database using ajax, jquery,and PHP not working

From Dev

Cloudinary Image Upload Using PHP Not Working

From Dev

upload file using ajax,jquery,php

From Dev

Upload image with Ajax and PHP

From Dev

Ajax Upload with JQuery and PHP

From Dev

Ajax file upload with jquery not working

From Dev

upload a file in the same page as the form using php and ajax not working

From Dev

PHP image upload code not working

From Dev

PHP File upload image not working

From Dev

AJAX image upload error with PHP

From Dev

Html Php Ajax image upload

From Dev

image upload via ajax php

From Dev

Is it possible to upload image to the server using Bootstrap's Modal dialog box, jQuery, AJAX and PHP? If yes how? If no what's the reason for it?

From Dev

WordPress image upload Using ajax?

From Dev

Upload image with phonegap using ajax

From Dev

Upload Image using ajax (json)

From Dev

Upload image to imgur using ajax

From Dev

How to upload multiple files using PHP, jQuery and AJAX

From Dev

How to upload multiple files using PHP, jQuery and AJAX

From Dev

Large CSV file upload using JQuery/Ajax in php?

From Dev

JQUERY + PHP + AJAX not working

From Dev

PHP using jquery to create multiple image upload and multiple textbox

From Java

jQuery AJAX file upload PHP

From Dev

Using AJAX / jQuery to refresh an image --> image_feed.php code?

From Dev

Upload files with Ajax in CodeIgniter with Jquery not working

Related Related

HotTag

Archive