This is the technical support forum for Toolset - a suite of plugins for developing WordPress sites without writing PHP.
Everyone can read this forum, but only Toolset clients can post in it. Toolset support works 6 days per week, 19 hours per day.
| Sun | Mon | Tue | Wed | Thu | Fri | Sat |
|---|---|---|---|---|---|---|
| - | 7:00 – 14:00 | 7:00 – 14:00 | 7:00 – 14:00 | 7:00 – 14:00 | 7:00 – 14:00 | - |
| - | 15:00 – 16:00 | 15:00 – 16:00 | 15:00 – 16:00 | 15:00 – 16:00 | 15:00 – 16:00 | - |
Supporter timezone: Europe/London (GMT+00:00)
This topic contains 17 replies, has 2 voices.
Last updated by 6 years, 1 month ago.
Assisted by: Nigel.
Sorry, that code in isolation is too abstract for me to try and reproduce the problem.
I don't know which tooltip solution you are using (jQueryUI? Bootstrap? Something else?), and as I can't see the page in question I've no idea what the markup looks like.
So let me come at this from another angle, and show you how to add Tooltips, without the need for so much custom code.
If you are using Toolset you are likely using Bootstrap (unless you have chosen not to), and tooltips are described here: hidden link
I created a View which lists posts and includes a taxonomy filter, where the results are updated by ajax.
The loop section of my View looks like this:
<p>Hover to see <a class="has-tooltip" href="[wpv-post-url]" title="[wpv-post-title]">the title</a> of the post being linked to</p>
In the custom JS editor of the output section I added the following:
( function( $ ) {
$( document ).ready( function(){
$('.has-tooltip').tooltip()
});
})( jQuery );
Very simple. I included a class "has-tooltip" in my markup where I wanted tooltips to be added, and included a title attribute which provides the text for the tooltip, and instantiated the tooltips with the above JS.
Now, if I use a Query Filter the results are updated and the tooltips will be lost, they need re-instantiating on the updated results.
I went back to the Search and Pagination editor of my View, where the taxonomy filter control is inserted. You will note there is a Frontend events button in the JS editor. Views triggers a series of custom JS events during pagination and custom searches, and you can use this button to insert wrapper JS with the appropriate event listener.
In my case I need to update the results once the custom search has completed, and so I ended up with the following to re-instantiate the tooltips:
jQuery( document ).on( 'js_event_wpv_parametric_search_results_updated', function( event, data ) {
$('.has-tooltip').tooltip()
});
You can see the results in the screen recording.
That is all that is required to add tooltips to a list of posts which also work after an ajax update. If you are not using Bootstrap this may need modifying, but probably not by much.
The code you shared above looks overly complex.
Everything in the chart section is manually copied and pasted into the body area of the WordPress editor. It's not done through Views at all. As a said earlier, I would like to start doing that, but couldn't wrap my head around how to implement it using Toolset.
Ideally, I would like to use Toolset to power the charts so that I can have a scenario where I can click on a track title and it will show me that track's chart history (peak position, number of weeks on chart, etc.),
I believe the jQuery tooltip code, which I entered in the theme options (see pic), is being injected in the footer.
