WordPress.org

Ready to get started?Download WordPress

Forums

WP-Table Reloaded
[resolved] How to Refresh table without refreshing whole page. (10 posts)

  1. tonyparera
    Member
    Posted 2 years ago #

    Hi,

    I manage to add data dynamically in the table, so it's no longer static data. Now i need to refresh this table without refreshing the whole page,

    Any AJAX or filter way possible?

    My link is http://www.oyetweet.com/fb_winning/ where it aromatically add the rows in the table but I need to update certain columns on regular or ad-hoc basis.

    Tony.

    http://wordpress.org/extend/plugins/wp-table-reloaded/

  2. TobiasBg
    Member
    Plugin Author

    Posted 2 years ago #

    Hi Tony,

    thanks for the question.

    Sorry, unfortunately, I don't have a readily usable solution to this.
    Your best bet is probably to create a custom AJAX handler in a custom WordPress plugin that simply uses the WP-Table Reloaded functions to get the table, and then replace the existing one with the new data.

    Maybe http://codex.wordpress.org/AJAX_in_Plugins helps with getting started.

    Regards,
    Tobias

  3. tonyparera
    Member
    Posted 2 years ago #

    Hi Tobias,

    Thanks, It always feel great to get response from the creator.

    Well, I manage to make it work like this. Pl. comment if any improvement can be done.

    $(document).ready(function(){
           $('.content1').bind('click', function(e){
             getContent('http://www.oyetweet.com/WP_prod/wp-content/plugins/autocompleter/values.php?tbl=1');
             event.preventDefault();
           });
    
                        function getContent(filename)
                        {
                            $.ajax({
                                url: filename,
                                type: 'GET',
                                dataType: 'html',
                                beforeSend: function() {
                                    $('.wp-table-reloaded, .wp-table-reloaded-id-2').html('<img src="http://www.jquery4u.com/images/loading.gif" />');
                                },
                                success: function(data, textStatus, xhr) {
                                        $('.wp-table-reloaded, .wp-table-reloaded-id-2').html(data);
                                },
                                error: function(xhr, textStatus, errorThrown) {
                                    $('.wp-table-reloaded, .wp-table-reloaded-id-2').html(textStatus);
                                }
                            });
                        }
    
         });

    and in value.php I called these three functions.

    if (($status = tony_update_wp_table_reload_cols_with_fb_opengraph(2)) !== FALSE){
      $status = tony_wp_table_reloaded_refresh(2);
      echo do_shortcode( '[table id=2 /]');
      } else {
      echo "Some issue, please refresh whole page.";
      }

    Not sure on how expensive this could be or any other better way to achieve this but now it works.

  4. TobiasBg
    Member
    Plugin Author

    Posted 2 years ago #

    Hi,

    yes, that's almost exactly what I meant :-) Going through a custom PHP file works nice, but maybe you can switch that to using a custom action in admin-ajax.php. That might be a bit better for maintaining everything in the future.

    Best wishes,
    Tobias

  5. tonyparera
    Member
    Posted 2 years ago #

    Hi Tobias,

    I tried this way but having one small issue,

    Added in function.php

    add_action('wp_ajax_my_action_wp_table_reload', 'my_action_callback');
    add_action('wp_ajax_nopriv_my_action_wp_table_reload', 'my_action_callback');
    
    function my_action_callback() {
    	global $wpdb; // this is how you get access to the database
    	$whatever = intval( $_POST['whatever'] );
    	//$whatever += 10;
      //echo $whatever;
    if (($status = tony_update_wp_table_reload_cols_with_fb_opengraph($whatever)) !== FALSE){
      $status = tony_wp_table_reloaded_refresh($whatever);
      echo do_shortcode( '[table id=' . $whatever . ' /]');
      } else {
      echo "Some issue, please refresh whole page.";
      }
    	die(); // this is required to return a proper result
    }

    and on the front0-end site, I added this in header template.

    add_action('wp_head', 'prefix_ajax_add_foobar');
    
     function prefix_ajax_add_foobar() {
     ?>
    <script type="text/javascript" >
    jQuery(document).ready(function($) {
    
    $('.content1').bind('click', function(e){
    //event.preventDefault();
    	var data = {
    		action: 'my_action_wp_table_reload',
    		whatever: 2
    	};
      alert('Got this from the server system: ' + MyAjax.ajaxurl);
    	// since 2.8 ajaxurl is always defined in the admin header and points to admin-ajax.php
    	$.post(MyAjax.ajaxurl, data, function(response) {
    		alert('Got this from the server system: ' + response);
    	});
      });
    });
    </script>
    <?php
    }

    All seems to work nice and I do receive $response variable in alert, but instead of getting full html output of table's shortcode , I just receive the string "[table id=2 /]" in $response.

    Do I need to add "require_once($path.'/wp-config.php');" in function my_action_callback() to make do_shortcode work ? Anything else am I missing ?

  6. TobiasBg
    Member
    Plugin Author

    Posted 2 years ago #

    Hi,

    you are doing everything right here. The problem just is that WP-Table Reloaded does not register the [table /] Shortcode on admin pages (like admin-ajax.php). It should however be possible to do this yourself, by adding

    include_once ( WP_TABLE_RELOADED_ABSPATH . 'controllers/controller-frontend.php' );
    $WP_Table_Reloaded_Frontend = new WP_Table_Reloaded_Controller_Frontend();

    before executing the Shortcode.

    Regards,
    Tobias

  7. tonyparera
    Member
    Posted 2 years ago #

    Hi,

    Perfect, Works like a charm. Thanks.

    Just one query, would it be expensive to add this controller file and initialize the class in every ajax callback functions ?

    Cheers,
    -Tony

  8. TobiasBg
    Member
    Plugin Author

    Posted 2 years ago #

    Hi Tony,

    I don't think so. This is the same as if you load any WordPress frontend page, even those that don't a Shortcode in them.
    If you just load the file in your own relevant AJAX callback functions, everything should be fine.

    Regards,
    Tobias

  9. tonyparera
    Member
    Posted 2 years ago #

    Thanks.

    Case closed.

    :)

  10. TobiasBg
    Member
    Plugin Author

    Posted 2 years ago #

    Hi,

    nice :-) Good to hear that everything is working!

    Best wishes,
    Tobias

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic