Hello!

I have a table with a variable and a chart that is linked to the table via "charts data filtering".  There is a dropdown on the page to set a new value for the table variable.  When the dropdown values changes, I use an AJAX call to get the output of a do_shortcode() call that uses the new variable value to rebuild the table.

However, the shortcode output is missing content and functionality.  I dug through the WPDataTables code and found that I was able to get the updated shortcode output to render properly if I borrowed these few lines of code from wpdatatables.js (around line 1593) and ran them in my own code in the ajax call:

/** 
* Loop through all tables on the page and render the wpDataTables elements
*/
$('table.wpDataTable:not(.wpdtSimpleTable)').each(function () {
    var tableDescription = JSON.parse($('#' + $(this).data('described-by')).val());        wdtRenderDataTable($(this), tableDescription);
});

This is a bit of a hack for me to use this snippet, but it does work.  Is there a more hook-like way to trigger this re-render?

Similarly, the chart that is connected to the table doesn't "see" the new table that is added with AJAX.  I found that if I borrowed the snippet from wdt.chartsRender.js, I could get the chart to reload once the AJAX call is complete.  But again, this is kludgy.  Is there a proper js hook to trigger a chart re-render?

If there are presently no hooks to do this, could they be added so that the solution is more robust? It seems that there have been similar use cases for this as well, I think like this one. 

Thank you for your help!

Hi Aleksandar,

Thank you for your response.  I don't think any of the existing hooks will work for this situation.  I will check with my client to see whether I can provide a duplicate of the site.

But in the meantime, I suspect that what I'm looking for is something that would need to go into a feature request.  Ideally, each table would have a secondary input for each variable that would allow a user to specify the ID of an element on the table's page that provides the value for the variable.  In other words, the variable value could come from the front-end instead of the back-end.

(See attached for example.)

The JS would be set up to watch for changes to that element, would scrub the input, and then would rebuild the table with the updated query.

I've built this functionality (except that my JS does not use dynamic input IDs for the variables) as a custom solution, which is fine except when it comes to the AJAX piece because there isn't really a good way to rebuild tables without reloading the page (without the hacky methods that I used).  I also found that when calling do_shortcode via an AJAX call, I had to replace the default table id because it is always set to 1 (also a bit kludgy).

So, basically, the most important part of the feature request is just for AJAX support so that the solution is more robust and doesn't break if there is a change to the way those functions work within the plugin.  The rest of it - like the extra inputs to specify element IDs - are just "nice to haves".

Thanks again for your help with this! I'll reach out again once I hear from my client.

Thanks!