4

Trying to use admin-ajax.php to upload image from front-end form. I'm keep getting 0 with below code I have and not sure how to debug this or where it goes wrong.

I have HTML input file

<input type="file" name="wh_image_upload" id="wh_image_upload" multiple="false" />

and localized script for AJAX request

$img_nonce = wp_create_nonce('image_upload_nonce');
wp_localize_script( 'ajax-script', 'ajax_image', array( 'ajax_url' => admin_url( 'admin-ajax.php' )) );

and PHP function

function write_here_featured_image_upload() {
    var_dump($_FILES);
    die();
}

add_action( 'wp_ajax_write_here_img_upload', 'write_here_featured_image_upload' );
add_action( 'wp_ajax_nopriv_write_here_img_upload', 'write_here_featured_image_upload' );

JS

// Featured image upload AJAX
    $("#wh_image_upload").change(function(){
        var userFile    =   new FormData();  
        var fileInput   =   $( "#wh_image_upload" )[0].files[0];
        //console.log(fileInput);

        userFile.append("file", fileInput);
        userFile.append("action", "write_here_img_upload");

        $.ajax({
            type: "POST",
            url: ajax_object.ajax_url,
            data: userFile,
            processData: false,
            contentType: false,
            error: function(jqXHR, textStatus, errorMessage) {
                console.log(errorMessage);
            },
            success: function(data) {
                console.log("Image Uploaded! " + data);
            }
        });
    });

I get a AJAX success message with response 0. Image Uploaded! 0

Update I updated my working code.

  • If you only want to run ajax on the admin side of things remove the nopriv hook - The Codex says: This hook is functionally the same as wp_ajax_(action), however it is used to handle AJAX requests on the front-end – Howdy_McGee Nov 24 '15 at 19:12
  • 1
    Updated working code on question. – Ohsik Nov 24 '15 at 22:14
5

Enable Debugging

WordPress has constants defined in wp-config.php where you can print errors to the screen and log them in a separate file located /wp-content/debug.log. It looks like this:

define( 'WP_DEBUG', true );
define( 'WP_DEBUG_DISPLAY', true );
define( 'WP_DEBUG_LOG', true );

You can then print your own information to the debug log at specific point and find out exactly where ( or if the function is even getting hit at all ) the function is erroring out:

function write_here_featured_image_upload() {
    error_log( 'Made it into the Ajax function safe and sound!' );
    /** ... Rest of your code ... **/
}

Check Dev Tools Console

Almost all browsers in this modern day have Developer Tools and a Console where Javascrpit errors are output to. If you see an error in your Dev Tools console you'll need to fix that first and foremost.


As for a possible solution, you have this conditional which is preventing you from running ajax on the front-end of the website:

if ( is_admin() ) {
    add_action( 'wp_ajax_write_here_img_upload', 'write_here_featured_image_upload' );
    add_action( 'wp_ajax_nopriv_write_here_img_upload', 'write_here_featured_image_upload' );
}

The function is_admin() tells WordPress to only run those actions whenever in the Admin Panel / Dashboard so you would never see anything happen on the front-end of your website. Try removing the conditional and just adding the action as is:

add_action( 'wp_ajax_write_here_img_upload', 'write_here_featured_image_upload' );
add_action( 'wp_ajax_nopriv_write_here_img_upload', 'write_here_featured_image_upload' );
  • Thank you for the answer, unfortunately removing is_admin() does not make any different. I'm still getting 0 for return. I have turned on all three debug mode but don't see any debug.log file created. Woking on Localhost might be the issue?? – Ohsik Nov 24 '15 at 20:47
  • @Ohsik shouldn't be. What happens if you hit the URL directly? http://localhost/wp-admin/admin-ajax.php?action=write_here_img_upload&test=true - you'll have to add a die( 'here' ); above your nonce check to see if you're even getting into the function. – Howdy_McGee Nov 24 '15 at 20:50
  • I'm getting -1 on check_ajax_referer( 'image_upload_nonce', 'security'); by accessing the URL directly – Ohsik Nov 24 '15 at 20:55
  • Yes, it created debug.log but it just says Made it into the Ajax function safe and sound!. Could please tell me where to go from here? – Ohsik Nov 24 '15 at 21:00
  • @Ohsik From there you debug what the issue is. Maybe dump your $_POST and $_GET values into the log: error_log( print_r( $val, 1 ) );. If I was a betting man I would bet that $_FILES is empty and you need to set an encrypttype. – Howdy_McGee Nov 24 '15 at 21:04

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.