Ajax Plugin Not Echoing Response

Question

I have created a plugin that will submit a form via ajax. Below is the php function.

add_action('wp_ajax_nopriv_audience_intel', 'audience_intel_ajax');
add_action('wp_ajax_audience_intel', 'audience_intel_ajax');
function audience_intel_ajax() {
    $likeit = $_POST['likeit'];
    $response = $_POST['response'];
    $postid = $_POST['postid'];

    add_option( 'testing_form_like', $likeit );
    add_option('testing_form_response', $response);

    global $wpdb;
    $tablename = $wpdb->prefix . "intel";

    $newdata = array(
        'radio' => $likeit,
        'feedback' => $response,
        'postid' => $postid
    );    

        $wpdb->insert (
        $tablename,
        $newdata
    );

    $result = "<p>Finished successfully!</p>";
    // json_encode($result);
    echo $result;
}

Here is my script.

jQuery(document).ready(function($) {
$('.audience_intel_container .close').click(function(){
    $('.audience_intel_container').fadeOut('fast', function(){

    });
});

$('.audience_intel_container button').click(function(){
    console.log('clicked');
    var formdata = $('#audience_intel_form').serialize();
    $.ajax({
        type : "post",
        dataType : "html",
        url : audience_intel_js.ajaxurl,
        data : 'action=audience_intel&'+formdata,
        success: function(response) {
            alert(response);
            $('.audience_intel_container').html(response);
        }
    })
})   
});

The form data is added to the database correctly, but I am not able show an output message after the request is complete. I have tried both return, echo, and echo json_encode in the ajax function.

I appreciate any insight.

Answer 1

This is the final code I am using. Thanks to webaware for pointing out that I was not using the correct datatype.

   jQuery(document).ready(function($) {
        $('.audience_intel_container .close').click(function(){
        $('.audience_intel_container').fadeOut('fast', function(){

        });
});

$('.audience_intel_container button').click(function(){
    console.log('clicked');
    var formdata = $('#audience_intel_form').serialize();
    $.ajax({
        type : "post",
        dataType : "html",
        url : audience_intel_js.ajaxurl,
        data : 'action=audience_intel&'+formdata,
        success: function(response) {
            alert(response);
            $('.audience_intel_container').html(response);
        }
    })
})   
});

php

add_action('wp_ajax_nopriv_audience_intel', 'audience_intel_ajax');
add_action('wp_ajax_audience_intel', 'audience_intel_ajax');
function audience_intel_ajax() {
$likeit = $_POST['likeit'];
$response = $_POST['response'];
$postid = $_POST['postid'];

add_option( 'testing_form_like', $likeit );
add_option('testing_form_response', $response);

global $wpdb;
$tablename = $wpdb->prefix . "intel";

$newdata = array(
    'radio' => $likeit,
    'feedback' => $response,
    'postid' => $postid
);

$wpdb->insert (
    $tablename,
    $newdata
);

$result = "<p>Finished successfully!</p>";
// json_encode($result);
echo $result;
exit;
}

Answer 2

You will be better off using the $.post for ajax. Have a look here http://codex.wordpress.org/AJAX_in_Plugins for more information.