No Red Validation Popup ToolTips When using Animate It on form

Ma

MattRoberts 24 Sep, 2016

Ive just updated Chronoforms V5 and Joomla to the latest versions on my website at www.MyLocalPCRepair.co.uk . On my contact form, the Red Popup Tooltips that state if a field is required or other validation error, no longer appear to show on Firefox 49.0.1 or Android browser. They do however work as normal on Safari on an Iphone and Ipad and the latest version of Chrome browser on my laptop. They did work on Firefox and Android browser on the older version of Chronoforms V5 before the update.

Any help appreciated.

Gr

GreyHead 25 Sep, 2016

Hi MattRoberts,

Sorry, no idea, I haven't seen this reported before. Are there any errors showing in the browser web developer tools like the font-awesome failing to load?

Bob

Gr

GreyHead 25 Sep, 2016

Hi MattRoberts,

Sorry, no idea, I haven't seen this reported before. Are there any errors showing in the browser web developer tools like the font-awesome failing to load?

Bob

Ma

MattRoberts 25 Sep, 2016

Found what is causing the problem. It appears that Chonoforms v5 doesnt like being used with transitions (the Joomla "Animate It!" extention to be exact). If have it set to "zoomin" on scroll, the red validation popup tooltips do not show in Firefox..although they do work in Chrome browser. The reason I didnt have a problem on Iphone Safari, is because I turn of animation on smaller screens.

Im guessing it may be something to do with location of where the tooltip needs to show (maybe?).

As a workaround I've turned off animation on the form and the tooltips work again.

Im pretty sure it worked ok with the older versions of Chronoforms v5. Are the older builds available to download anywhere so I can test on a localhost? Thanks. It may also be that Animiate It plugin has updated and is the reason for this incompatibility.

Also is there anyway I can change the title of this thread to a more suitable one to warn other users of this incompatibility.

Gr

GreyHead 25 Sep, 2016

Hi MattRoberts,

Post your preferred topic title here and I can change it for you. (User editing is turned off because we had too many spammers who would post something innocuous then come back later and stuff it with links.)

Please post a link to the form so I can take a quick look, this isn't an effect that I've seen before.

Bob

Ma

MattRoberts 26 Sep, 2016

Hi Bob,

Thank you for looking into this.

The contact form is at the bottom of my single page website at https://www.mylocalpcrepair.co.uk/#g-belowmain1

I've switched on the animation on the form and the "bug" is back. If I switch off the animation the Validation tooltips work correctly. The bug shows on Firefox, but doesnt appear to show on Chrome when I tested.

If you could change the title of this thread to "No Red Validation Popup ToolTips When using Animate It on form". This should help anyone else who may get the same issue. Thanks.

Please post here when you have finished looking so I can remove the animation again.

Gr

GreyHead 26 Sep, 2016

Hi MattRoberts,

I only see a blank page in both Chrome and FireFox :-(

Bob

Ma

MattRoberts 26 Sep, 2016

Sorry Bob. My website host, NetworkPanda is having issues at the moment. Appears to be back up now (fingers crossed).

Gr

GreyHead 26 Sep, 2016

Hi MattRoberts

Still doesn't like me :-(

Request URL:https://www.mylocalpcrepair.co.uk/
Request Method:GET
Status Code:403 Forbidden
Remote Address:51.254.152.173:443

Bob

Ma

MattRoberts 29 Sep, 2016

Hi Bob,

Hope you are well. Sorry about taking sometime to reply, but been working away.

OFFTOPIC: I got in touch with my hoster about the reasons why you can't access my website and they started asking if you are using a proxy or VPN. Obviously I shouldnt really need to ask someone if they using a proxy or VPN, or what their IP address is when accessing my website as it could cause you a security risk...and at the end of the day your doing me a favour by having a look at a potential bug on a contact form. I'm really starting to think I may have to move host, as although I appreciate the need for website security, I feel my hosting service has a overactive firewall that could be blocking my customers reaching my website.

ONTOPIC: If you could kindly see if you can access my website again, and see if you can spot the incompatibility of Chronoforms and the animate it joomla plugin. Hopefully, whatever was blocking you, shouldn't be now (fingers crossed).

Gr

GreyHead 29 Sep, 2016

Answer

1 Likes

Hi Matt,

No VPN or proxy, though I do use OpenDNS as my DNS lookup (shouldn't have any affect though), and I am outside the UK so maybe I'm Brexit blocked. . . . I just checked and I can see the site today . . .

There are a bunch of JS errors showing - actually I think that it is one error repeated many times as more are added when I scroll up and down the page.

It looks as though the source of the error is in this script

				   if (lastId !== id) {
					   lastId = id;
					   // Set/remove active class
							baseItems.parent().parent().find('.active').removeClass('active');
					   baseItems
						 .parent().removeClass('active')
						 .end().filter('[href$=#'+id+']').parent().addClass('active');
				   }

where the filter line is failing.

Bob

Ma

MattRoberts 29 Sep, 2016

Thanks Bob. Appreciate you having a quick look.

I'm guessing it's a bug with the animate it plugin, as this "activates" the animations on scroll, and would mean you get repeated errors when scrolling. As you can tell, debugging js and websites is foreign to me. I think i will just disable it on the form section for the time being, and investigate it when I know more about debugging.

Thanks once again for your effort and time.

Forums

No Red Validation Popup ToolTips When using Animate It on form