CODEWITHSUNDEEP
javascriptphpjqueryajaxwordpress
Giedidius
Giedidius

Reputation: 75

jQuery ajax not working in wordpress

Could someone explain my why this jQuery code could not work? I'm always getting console.log(). WebsiteData.ajax_url alert prints correct url.

$('.variations_form').submit(function () {
    var html = $('#website-textarea').html();
    //alert(WebsiteData.ajax_url);
    jQuery.ajax({
        url : WebsiteData.ajax_url,
        type : 'post',
        data : {
            action : 'post_love_add_love',
            html : html
        },
        success : function( response ) {
            alert(response);
        },
        error: function(response) {  
            console.log(response);
        }
    });
});

php code:

class WebsiteIconInsertion {

    public function __construct() {
        add_action( 'wp_enqueue_scripts', array( $this, 'AddStyles' ) );
        add_action( 'wp_ajax_post_love_add_love', array($this, 'post_love_add_love') );
        add_action( 'wp_ajax_nopriv_post_love_add_love', array($this, 'post_love_add_love') );
    }

    public function AddStyles() {          
        wp_register_script( 'website-icons-js', plugin_dir_url( __FILE__ ) . 'public/js/website-icons.js');
        wp_localize_script( 'website-icons-js', 'WebsiteData', array('ajax_url' => admin_url( 'admin-ajax.php' ), 'file_path' => plugin_dir_url( __FILE__ )));
        wp_enqueue_script( 'website-icons-js' );
    }

    function post_love_add_love() {
            echo "nx";
            die();
    }
}

Upvotes: 0

Views: 4923

Answers (4)

Dipen Desai
Dipen Desai

Reputation: 149

try this

<script>
  jQuery( document ).ready(function() {
  jQuery( ".remove_compare" ).click(function() {
        var current_att=jQuery(this);
        jQuery.ajax({
              url: "<?php echo admin_url('admin-ajax.php'); ?>",
              type: 'POST',
              data: {
                     action: 'remove_to_compare',
                     user_id:jQuery(this).attr("user_id"),       
                    },
              success: function(response) {
                   //code
              }

       });
     });
 });
</script>

 add_action( 'wp_ajax_remove_to_compare', 'remove_to_compare' );     
 add_action( 'wp_ajax_nopriv_remove_to_compare', 'remove_to_compare' );
 function add_to_compare(){
            //coading….
 }

Upvotes: 1

Mohsin khan
Mohsin khan

Reputation: 136

   jQuery('.variations_form').submit(function () {
        var html = jQuery('#website-textarea').html();
        var ajaxurl = 'https://example.com/wp-admin/admin-ajax.php';
        jQuery.ajax({
            url : ajaxurl ,
            type : 'post',
            data : {
                action : 'post_love_add_love',
                html : html
            },
            success : function( response ) {
                alert(response);
            },
            error: function(response) {  
                console.log(response);
            }
        });
    });

Upvotes: 1

Nikola Kirincic
Nikola Kirincic

Reputation: 3757

Double check that admin ajax url is correct ( value of BeewoodData.ajax_url ) and created from php function admin_url( 'admin-ajax.php' ); Make sure you added actions in the backend, according to action you defined in data object ( post_love_add_love ): 

add_action( 'wp_ajax_post_love_add_love', 'your_custom_ajax_callback' ); //for logged users

add_action( 'wp_ajax_nopriv_post_love_add_love', 'your_custom_ajax_callback' ); //for anon users, note that I| added same callback, but you can change it if differs for logged in and anonymous users

Also, make sure that within function your_custom_ajax_callback your last line should be ending with die(), otherwise, json_output or any other response would be invalid and have other outputs from WordPress attached. 

function your_custom_ajax_callback() {

//do your custom code
echo json_encode($output); 
die(); 

}

Upvotes: 0

abhirathore2006
abhirathore2006

Reputation: 3745

to make ajax work for both logged in and logged out user, you need two separate actions

//Actual ACTION NAME IS my_action
//for logged in user
add_action( 'wp_ajax_my_action', 'my_action_callback' );

//for non logged in user
add_action( 'wp_ajax_nopriv_my_action', 'my_action_callback' );

Also the ajax url should corresponds to admin ajax url, which you can get using

wp_localize_script( 'ajax-script', 'ajax_object',
            array( 'ajax_url' => admin_url( 'admin-ajax.php' ), 'we_value' => 1234 ) );

Upvotes: 0

Related Questions