Ajax not returning anything on form submit

Question

I am working in wordpress and on pressing the submit button I want the function to return result through ajax and result should be shown as an alert on the screen. But when I press submit nothing shows.

Below is my code

Ajax code (ajaxinsert.js file)

jQuery(document).ready(function(){

////////////////////////////////////////////////////////////
    jQuery("#addimage").submit(function (e) { //form is intercepted
        e.preventDefault();
        //serialize the form which contains secretcode
        var sentdataa = $(this).serializeArray();

        //Add the additional param to the data        
        sentdataa.push({
            name: 'action',
            value: 'wp_up'
        })

        //set sentdata as the data to be sent
        jQuery.post(yess.ajaxurl, sentdataa, function (rez) { //start of funciton
            alert(rez);

            return false;
        } //end of function
        ,
        'html'); //set the dataType as json, so you will get the parsed data in the callback
    }); // submit end here
});

HTML Form

<form id="addimage" action="" method="post" enctype="multipart/form-data">
<input type="submit" name="upload" style="margin-bottom:15px;">
</form>

PHP code (I have used shortcode on the page for this code and below code is in functions.php file):

add_shortcode( 'test', 'addimage' );

function wp_up()
{   
echo "zeeshanaslamdurrani";
exit();

}

function addimage(){  

add_action( 'wp_ajax_wp_up', 'wp_up' );
add_action( 'wp_ajax_nopriv_wp_up', 'wp_up');


// register & enqueue a javascript file called globals.js
wp_register_script( 'globalss', get_stylesheet_directory_uri() . "/js/ajaxinsert.js", array( 'jquery' ) ); 
wp_enqueue_script( 'globalss' );

// use wp_localize_script to pass PHP variables into javascript
wp_localize_script( 'globalss', 'yess', array( 'ajaxurl' => admin_url( 'admin-ajax.php' ) ) );
} 

Answer 1

Shortcodes are too late to add ajax actions. Additionally, that actions would be added only if shortcode is executed, which is very unlikely to happen on a ajax request. The quickest way to make your code work is to move the add_action outside addimage() function.

add_action( 'wp_ajax_wp_up', 'wp_up' );
add_action( 'wp_ajax_nopriv_wp_up', 'wp_up');
function wp_up() {   
    echo "zeeshanaslamdurrani";
    exit();
}

add_shortcode( 'test', 'addimage' );
function addimage(){     

    // register & enqueue a javascript file called globals.js
    wp_register_script( 'globalss', get_stylesheet_directory_uri() . "/js/ajaxinsert.js", array( 'jquery' ) ); 
    wp_enqueue_script( 'globalss' );

    // use wp_localize_script to pass PHP variables into javascript
    wp_localize_script( 'globalss', 'yess', array( 'ajaxurl' => admin_url( 'admin-ajax.php' ) ) );
} 

Viewing your code, you may be interested also in this question: Enqueue Scripts / Styles when shortcode is present.

Answer 2

You specify in the jquery API call that you expect to receive as a response a valid html, but the server returns simple text and not html, and this is probably the reason jquery decides that the request failed.

Always look at the actual traffic with browser developer tool to debug whether ajax responses are being sent or not.