It actually does appears to be the theme. Turns out it’s not all that difficult to try a few things on mobile. I just opened the WP Customizer from within Firefox mobile and previewed the standard Twenty Fifteen theme. Navigated to the Forum, selected Profile and there the buttons work just fine.

Now the question is how to debug further from here. I tried Firefox remote debugging but it also only shows that one error.

You know it would not have occurred to me to try that. Neat.
Well the first and simple thing to check is that it IS using the proper jQuwry and jQuery UI libraries from the wordpress wp-includes folders.
Also check to see if it makes use of the Bootstrap js library – It’s a long shot but always worth checking for.
After that I think you are in that position of having to turn components of the theme off if that is possible. Maybe put your site into maintenance mode for half an hour…

I tried turning off anything I could in the theme – to no avail. I compiled a list o fall JS included with the theme:

ajax.js
ajax.min.js
bootstrap.carousel.js
bootstrap.min.js
Chart.min.js
colorpicker.js
default.js
default.js
default.min.js
doubletaptogo.js
html5.js
jplayer.min.js
jquery-1.10.2.min.js
jquery.appear.js
jquery.carouFredSel-6.2.1.js
jquery.easing.1.3.js
jquery.fitvids.js
jquery.flexslider-min.js
jquery.fullPage.min.js
jquery.hoverIntent.min.js
jquery.isotope.min.js
jquery.mousewheel.min.js
jquery.nicescroll.min.js
jquery.nouislider.min.js
jquery.prettyPhoto.js
jquery.stylish-select.min.js
jquery.touchSwipe.min.js
jquery.waitforimages.js
lemmon-slider.js
mediaelement-and-player.min.js
modernizr-2.6.2.min.js
plugins.js
qode_shortcodes.js
qode_sidebar.js
qode-like.js
qodef-ui.js
select2.min.js
skrollr.js
SmoothScroll.js
toolbar.js

Does anything stand out as a potential culprit?

To be fair I know very few of those libraries.

The Bootstrap worries me a little. That can definitely have the effect of rendering some (not all) buttons dumb. You can actually test this if you use the file uploader plugin. Open uo the editor to make a post, click on the attachments button, select an attachment or drag an image into the box and see if the ‘Start’ button becomes available. Bootstrap will stop it so that nothing happens.

This is because is stomps all over the jQuery UI button script (which is the one that WordPress supplies as standard). We do have some code in the forum to try and prevent this happening but I doubt it is watertight as so much depends on loading. So that may be worth a look. First though you ned to determine if it really IS being loaded on the mobile side.

Unfortunately that doesn’t seem to be it. The uploader works fine on both, desktop and mobile. I’ll check later on again what scripts are loaded on the mobile page.

I have some feedback form the theme developer o n this issue. Took a while for them to get around to check but here’s what they found:

I found the reason why you got this issue but I don’t know how to fix it 🙁

Problem is native jQuery UI script we used for UI elements in our theme (accordion, tabs etc) https://jqueryui.com/

And when I went into your stockholm theme folder/js/plugins.js and removed this code from screenshot

http://screencast.com/t/bNk4drfhEW

then your forum works fine, also I tried to upload the latest version of this script and problem is same.

So you need to contact author of this plugin and to see is there some solution for this when we know what is the problem now. Thanks

Any further ideas as they are obviously not sure what to do?

Well this is what we have had to say on this subject before:

https://simple-press.com/documentation/codex/faq/troubleshooting/what-is-this-jquery-conflict/

Theme and plugin authors MUST use the standard, supplied, tested and fully supported libraries that WordPress supplies for this very reason.  The WP team are considering banning themes and plugins from their repositories that do not adhere to this simple requirement.

Any plugin that utilises these core scripts – like Simple:Press – is in danger of being broken by this disregard for standards. I can think of no excuse for breaking them.

Well that’s good to know (I guess) though it doesn’t really help me since I have no influence on the internal structure of products I purchase. I am just a customer that trust everyone knows what they’re doing. However, I shared your feedback with the theme developers. I know close to nothing about jquery but by the googling I’ve done it appears they load UI elements from a bundled external library when actually all of this is included in WP since version 3.3 – at least that’s how it looks from my simplistic perspective.

I am curious though as to why everything works just swell except for that tiny portion in the SP mobile template. Nothing else is affected, neither on the desktop side nor other parts of the mobile side. Just the profile section on just the mobile theme.

since its a non standard jquery library, hard to tell.. but might just be slightly different version than that package with wp, so not ‘routinely’ used…

is your theme doing anything with the ui elements on the forum page?  could it be selectively disabled on the forum page?

I don’t think it’s really doing anything with the ui elements on the forum page. I actually use none of the “fancy” features of this theme (animated titles, ajax loading, etc.). I was wondering too if it could be selectively disabled or perhaps block the jquery ui it loads for just the forum.

we are saying the same thing…

is this theme updates often?  would be pretty easy to modify it for this, but changes would be lost if the theme is updated…

if you can find where in the theme its loading its own version of jquery ui, we might be able to offer some code to override it for forum pages…

The theme developers came back to me and went above and beyond to change their theme (which is, as mentioned, quite complex). They broke out features from their plugins.js and properly enqued them the WP in the themes function.php. Yet, it still doesn’t work, the profile tabs won’t respond. I spent some time on my own then trying to figure out what was going on and only when I commented out all possible enqued jquery instances did the tabs respond.

As I am not sure how many of our students would and will actually edit their profile on a mobile device, I don’t have any feedback yet, I feel that the effort has reached a questionable ROI time wise. So as a last ditch effort I looked at the Unified theme itself. I oped up spProfileEdit and noticed that there are two separate functions for editing the profile, one for mobile and one for desktop. So I figured I’ll simply change

                if ($spDevice == 'mobile') {

                    sp_ProfileEditMobile();

                }

to

               if ($spDevice == 'mobile') {

                    sp_ProfileEdit();

                }

And waddaya know, it works like a charm. Sure it doesn’t quite look as pretty as the native mobile edit but it does work and since it’s surrounded by the mobile theme there’s no visible difference to the user, except that tabs are on the left and are bit squished depending on the screen orientation.

So that’s the solution.

Would be nice to find the problem though. There is still clearly some sort of conflict at play. As to the theme authors then good for them. We have encountered others in the past who just dismiss the whole thing ot – worse – do not even bother to respond at all.

I agree, but it is difficult to troubleshoot with current mobile tools. Unfortunately my time is limited and the issue might only effect a very small percentage of users so have to leave it at that for now.

Agreed, it’s a tough one. Do let us know when and if you want to re-investigate, although Andy or Steve might have further questions.