I have a view set up to display the output in a table with the table headers set to be sortable. This view worked perfectly previously, but now the sorting is no longer working.
The page can be seen here:
hidden link
When you hover on the table headers, they show the little arrow indicating they are sortable. But when you click on the header, nothing happens. I'm not sure why this is no longer working.
Hi,
Thank you for contacting us and I'd be happy to assist.
I tested a view with a similar setup on my website, but couldn't reproduce any issue with the heading sorting feature.
This suggests that something specific to your website is involved. To troubleshoot this, I'll suggest the following steps:
1. Please make sure that WordPress, active theme and plugins are all updated to the latest versions.
2. It would be interesting to test this with all non-Toolset plugins disabled and a default theme like Twenty Twenty-One.
If it's fixed, you can start adding the disabled items, one-by-one, to narrow down to a possible conflicting one.
3. In case the issue still persists, I'll need your permission to download a clone/snapshot of the website, to investigate this on a different server.
Note: I already have the website's admin access details from your previous ticket.
regards,
Waqar
The site is fully updated, so that's not it.
I'll have to wait until the overnight hours to disable all other plugins and use a default theme. We'll probably not have any site traffic at 3 AM or so, so that's the time to do it. I'll let you know what I find with that as soon as I do it.
Sure please take your time and let me know how it goes.
OK, I disabled all plugins except for all the Toolset plugins and Woocommerce which one of the Toolset plugins said was necessary to stay on. I also left child theme configurator installed because I've seen things go haywire when changing themes. I saved all my custom CSS to my system before changing the theme as well. Fortunately nothing seems to have gone wrong after changing the theme this time.
After disabling all plugins, there was no impact. After changing the theme with the plugins still off, no impact.
So let me know how to proceed from here. Sorry if this is going to turn into a huge amount of effort now. Below is what's in the loop editor for the view. I'm hoping you'll see something in there that would allow you to easily figure it out without having to clone the site.
[wpv-layout-start]
[wpv-items-found]
<!-- wpv-loop-start -->
<table width="100%" class="hills-table">
<thead>
<tr style="background: #000000; color: #ffffff; font-weight: bold; text-align: center; padding: 5px;">
<th style="background: #000000; color: #ffffff; text-align: center;">[wpv-heading name="loop-index"]Map Number[/wpv-heading]</th>
<th style="background: #000000; color: #ffffff; text-align: center;">[wpv-heading name="post-title"]Hill Name[/wpv-heading]</th>
<th style="background: #000000; color: #ffffff; text-align: center;">[wpv-heading name="types-field-distance-in-miles"]Distance (in miles)[/wpv-heading]</th>
<th style="background: #000000; color: #ffffff; text-align: center;">[wpv-heading name="types-field-average-grade"]Average Grade (in %)[/wpv-heading]</th>
<th style="background: #000000; color: #ffffff; text-align: center;">[wpv-heading name="types-field-peak-grade"]Peak Grade (in %)[/wpv-heading]</th>
<th style="background: #000000; color: #ffffff; text-align: center;">[wpv-heading name="types-field-lowest-elevation"]Lowest Elevation (in feet)[/wpv-heading]</th>
<th style="background: #000000; color: #ffffff; text-align: center;">[wpv-heading name="types-field-highest-elevation"]Highest Elevation (in feet)[/wpv-heading]</th>
<th style="background: #000000; color: #ffffff; text-align: center;">[wpv-heading name="types-field-elevation-difference"]Elevation Difference (in feet)[/wpv-heading]</th>
</tr>
</thead>
<tbody class="wpv-loop js-wpv-loop">
<wpv-loop>
[wpv-item index=odd]
<tr class="odd" style="text-align: center; padding: 5px;">
[wpv-post-body view_template="loop-item-in-clermont-hills"]
</tr>
[wpv-item index=even]
<tr class="even" style="text-align: center; padding: 5px; background: #DDDAD3;">
[wpv-post-body view_template="loop-item-in-clermont-hills"]
</tr>
</wpv-loop>
</tbody>
</table>
<!-- wpv-loop-end -->
[/wpv-items-found]
[wpv-no-items-found]
<strong>[wpml-string context="wpv-views"]No items found[/wpml-string]</strong>
[/wpv-no-items-found]
[wpv-layout-end]
Thanks for the update.
I've reviewed the view's set up again, but unfortunately, couldn't find anything obvious, which could break the header sorting.
So for deeper investigation I'll need your permission to clone the website on a test server.
Yes, you can proceed. Sorry this is going to be this difficult, and I'll be especially sorry if it turns out to be something dumb on my part that I'm missing as I fear is going to be the case with this. Just please delete everything with the cloned version of the site after the issue is resolved. Let me know if you need anything else.
Thank you for the permission and I've downloaded the website's clone.
I'm currently running some tests and will share the findings, as soon as this testing completes.
Thank you for waiting.
During troubleshooting, I noticed that the issue of the header sorting is limited to this particular view only (i.e. view named 'Clermont Hills Table'). If a new view is created, it works correctly.
Some code needed for the sorting and filtering seems to be missing from this view and there is no way to restore it to its default state.
You can create a new view, set it the same way as this existing view, copy/paste the same code from all of its code sections and then use it in its place.
I hope this helps and please let me know, how it goes.
OK. That's something that was lost when I migrated the website manually from the development domain to the live domain. My Views all break when I do that, and I have to restore them, but I didn't know that I also lost code in them that provides that sorting. I'll rebuild it the same way I made it before. Thanks for the diagnosis.
You're welcome and glad I could help.
Manual migration can cause complications, especially because of the serialized data.
Officially we use and recommend the following two plugins to migrate or clone websites safely:
1. Duplicator – WordPress Migration Plugin
https://wordpress.org/plugins/duplicator/
2. All-in-One WP Migration
https://wordpress.org/plugins/all-in-one-wp-migration/
Feel free to mark this ticket as resolved and start a new one for each new question or concern.
