Ajax not working in wordpress

I have the following:

add_action('admin_head', 'fbdi_scripts');
function fbdi_scripts(){
    $siteurl = get_site_url();
    $plotGraph =  $siteurl . '/wp-content/plugins/' . basename(dirname(__FILE__)) . '/plotgraph.php';
    echo "<script>

function fbvaPlotGraph(){
    var selectedMessages = 'testing';
    var ajaxRequest;                                
    try{                
        ajaxRequest = new XMLHttpRequest();
    } 
    catch (e){              
        try{
            ajaxRequest = new ActiveXObject('Msxml2.XMLHTTP');
        } catch (e) {
            try{
                ajaxRequest = new ActiveXObject('Microsoft.XMLHTTP');
            } catch (e){                        
                return false;
            }
        }
    }           
    ajaxRequest.onreadystatechange = function(){
        if(ajaxRequest.readyState == 4){
            var response = ajaxRequest.responseText;    
                alert('response');                      
            }
        }
        var parameters = 'messages='+selectedMessages;
        ajaxRequest.open('POST','".$plotGraph."', true);
        ajaxRequest.setRequestHeader('Content-type', 'application/x-www-form-urlencoded')
        ajaxRequest.send(parameters);   
    }
    </script>";
}

And then i try to run that script with the following button.

Read More
 <button type="button" onclick ="fbvaPlotGraph()">Plot Graph</button> 

But it never works. I can confirm the button is working as it will fire a simple alert(‘Works’); if i place it in the fbvaPlotGraph function.

It just seems as soon as I add the ajax stuff I can never get a response. Its really confusing because i’ve implemented ajax in plugins in this exact way before and never had any issues.

Related posts

Leave a Reply

1 comment

  1. You should not use direct call to your plugin files. As WordPress has its own ajax model for both authenticated and public ajax call.

    Direct PHP call in plugins folder may be disabled for security purpose then it will not work.

    Use this approach

    add_action('admin_head', 'fbdi_scripts');
    function fbdi_scripts(){
    
    $siteurl = get_site_url();
    
    $plotGraph =  $siteurl . '/wp-admin/admin-ajax.php';
    
    echo "<script>
    
    function fbvaPlotGraph(){
    
            var selectedMessages = 'testing';
    
    
            var ajaxRequest;                                
    
            try{                
                ajaxRequest = new XMLHttpRequest();
            } 
            catch (e){              
                try{
                    ajaxRequest = new ActiveXObject('Msxml2.XMLHTTP');
                } catch (e) {
                    try{
                        ajaxRequest = new ActiveXObject('Microsoft.XMLHTTP');
                    } catch (e){                        
    
                        return false;
                    }
                }
            }           
            ajaxRequest.onreadystatechange = function(){
    
                if(ajaxRequest.readyState == 4){
                    var response = ajaxRequest.responseText;    
    
                    alert('response');                      
                }
            }
            var parameters = 'messages='+selectedMessages+'&action=actionName';
            ajaxRequest.open('POST','".$plotGraph."', true);
            ajaxRequest.setRequestHeader('Content-type', 'application/x-www-form-urlencoded')
            ajaxRequest.send(parameters);   
    
    }
    </script>";
    }
    
    add_action('wp_ajax_actionName', 'callbackname');
    function callbackname() {
        echo "your data";
        die;
    }
    

    Check here https://codex.wordpress.org/AJAX_in_Plugins