By Vivek


2019-06-12 05:14:06 8 Comments

When the user clicks class count the counter should work:

<div class="pop-btn" class="counter"><a href="https://www.example.com">Know More</a></div>
<div class="count"></div>

The problem is that I want the number to be saved, so for example:

user #1 clicks on the div with class "counter" 10 times

user #2 opens the site and the count is at 10, he clicks and now the counter starts 11 and so on with new users.

I'm trying to do this to keep track of how many times a file has been downloaded.

Any idea how can I do that?

Here is the code I have:

functions.php

function js_enqueue_scripts() {
wp_enqueue_script ("my-ajax-handle", get_stylesheet_directory_uri() . "/js/counter.js", array('jquery')); 
wp_localize_script('my-ajax-handle', 'the_ajax_script', array('ajaxurl' =>admin_url('admin-ajax.php')));
} 
add_action("wp_enqueue_scripts", "js_enqueue_scripts");


function set_button_count(){

  $counterFile = 'counter.txt' ;

// jQuery ajax request is sent here
if ( isset($_POST['increase']) )
{
    if ( ( $counter = @file_get_contents($counterFile) ) === false ) die('Error : file counter does not exist') ;
    file_put_contents($counterFile,++$counter) ;
    echo $counter ;
    return false ;
}

if ( ! $counter = @file_get_contents($counterFile) )
{
    if ( ! $myfile = fopen($counterFile,'w') )
        die('Unable to create counter file !!') ;
    chmod($counterFile,0644);
    file_put_contents($counterFile,0) ;
}


}
add_action('wp_ajax_nopriv_set_button_count', 'set_button_count');
add_action('wp_ajax_set_button_count', 'set_button_count');

Counter.js

jQuery(document).on('click','.counter',function(){
jQuery('.count').html('Loading...');
var ajax = jQuery.ajax({
method : 'post',
url : the_ajax_script.ajaxurl, // Link to this page
data : { 'action':'set_button_count','increase' : '1' }
});
ajax.done(function(data){
jQuery('.count').html(data) ;
});
ajax.fail(function(data){
alert('ajax fail : url of ajax request is not reachable');
});
});

Console Error: Error 400 Post /wp-admin/admin-ajax.php

1 comments

@Vivek 2019-06-16 06:25:26

Made ajax call as a function to avoid the Console Error 400 Post. It opens the channel and I was able to get the parameters passed.

counter.js

 jQuery(document).on('click','.counter',function(e){
 testAjax(the_ajax_script.ajaxurl);
 });


function testAjax(link) {
    $.ajax({
    url: link,
    type: 'post',
    data: {
    'action': 'set_button_count', 
    'increase' : '1'
  },  
  success: function(data) {
     jQuery('.count').html(data);
  }
  });
}

In functions.php I changed the $counterFile variable value to the link of a text file, which I uploaded via the WordPress admin panel. I specified the link as the server directory path, to avoid the error["failed to open stream: HTTP wrapper does not support writeable connections"].

functions.php

function js_enqueue_scripts() {
wp_enqueue_script ("my-ajax-handle", get_stylesheet_directory_uri() . "/js/counter.js", array('jquery')); 
wp_localize_script('my-ajax-handle', 'the_ajax_script', array('ajaxurl' =>admin_url('admin-ajax.php')));
} 
add_action("wp_enqueue_scripts", "js_enqueue_scripts");


function set_button_count(){

  $counterFile = '/home/example/public_html/wp-content/uploads/2019/06/counter.txt';
  if ( isset($_POST['increase']) )
{
    if ( ( $counter = @file_get_contents($counterFile) ) === false ) die('Error : file counter does not exist') ;
    file_put_contents($counterFile,++$counter);
    echo file_get_contents($counterFile);
    wp_die();
}

if ( ! $counter = @file_get_contents($counterFile) )
{
    if ( ! $myfile = fopen($counterFile,'w') )
        die('Unable to create counter file !!') ;
    chmod($counterFile,0644);
    file_put_contents($counterFile,0) ;
}
wp_die();

}
add_action('wp_ajax_nopriv_set_button_count', 'set_button_count');
add_action('wp_ajax_set_button_count', 'set_button_count');

Hope it helps someone.

@Sally CJ 2019-06-16 10:45:38

Ok, and don't forget to accept your answer. :) Cheers! (PS: I've removed my answer.)

Related Questions

Sponsored Content

1 Answered Questions

Best place to load wp_ajax_the_ajax_hook action in plugin

  • 2016-02-19 22:18:59
  • Rodolfo Cristovao
  • 586 View
  • 1 Score
  • 1 Answer
  • Tags:   plugins ajax

1 Answered Questions

2 Answered Questions

[SOLVED] Add Ajax Hooks and Call from Custom Template PHP

  • 2018-01-09 21:15:37
  • Seth Spivey
  • 1497 View
  • 0 Score
  • 2 Answer
  • Tags:   php jquery ajax

3 Answered Questions

[SOLVED] Specify ABSPATH in jQuery url

  • 2012-05-30 15:41:26
  • AlxVallejo
  • 2328 View
  • 0 Score
  • 3 Answer
  • Tags:   ajax forms

2 Answered Questions

1 Answered Questions

[SOLVED] Wordpress plugin: admin-ajax.php not passing data to custom function

1 Answered Questions

[SOLVED] Ajax custom search not functioning as expected

  • 2013-09-26 06:35:50
  • gaoshan88
  • 84 View
  • 1 Score
  • 1 Answer
  • Tags:   ajax

1 Answered Questions

[SOLVED] Custom counter when link is clicked in Wordpress

  • 2013-01-22 07:21:45
  • Emerson Maningo
  • 699 View
  • 0 Score
  • 1 Answer
  • Tags:   jquery wpdb

Sponsored Content