Php photo gallery TWG | JFUploader | TWG Flash upload | WFU | Forum
https://www.tinywebgallery.com/forum/

JavaScript Conflict -- AngularJS
https://www.tinywebgallery.com/forum/viewtopic.php?f=21&t=4372
Page 1 of 1

Author:  teracomp [ 5. Jul 2017, 20:20 ]
Post subject:  JavaScript Conflict -- AngularJS

I'm seeing some very strange interactions with form validation on my registration page when viewed through the iframe plugin. On my original site, it works as designed, but thru the plugin, it's quite difficult to work with.

1. Here's the original site registration form: http://plantertools.com/dm5/app/#/register
2. Here's the site registration through ai: http://church-multiplication.com/disciplemaker/ (click the register button)

Here's the issue, only for #2:
When you start to type in the first text box for Email, as soon as the email looks valid, the text box loses focus and you have to click back in the text box to complete the entry. The same behavior is true for each form entry, as soon as it switches from invalid to valid, focus is lost and the user has to click back in each text box.

Please let me know if that explanation makes sense.

If it does, how can I get around that? I must use the Advanced iframe plugin for registration...no way around that. Please advice.

Author:  TinyWebGallery [ 5. Jul 2017, 22:52 ]
Post subject:  Re: JavaScript Conflict -- AngularJS

I just checked this url at
http://www.tinywebgallery.com/blog/advanced-iframe/free-iframe-checker

This only renders a iframe without any advance iframe pro Javascript. And there I have the same behaviour. So it seems to be not related to my code but the iframe itself.

So angular seems to set this focus wrong. I think you need to fix this in the app.

Best, Michael

Author:  teracomp [ 25. Jul 2017, 15:26 ]
Post subject:  Re: JavaScript Conflict -- AngularJS

I've received so many complaints that i have to look at this again.

When I comment OUT the ai_external.js <script> in my index.html file there is NO problem with the form.

However, without your ai_external.js script, the iframe does not resize properly, so I need the script, but i need to modify it somehow to avoid the js conflict with form validation.

Any insight would be greatly appreciated.

Author:  TinyWebGallery [ 26. Jul 2017, 09:10 ]
Post subject:  Re: JavaScript Conflict -- AngularJS

do you have 2 versions running? one with and one without the ai_external.js. So that I can try in the iframe checker?

Can you reproduce your problem here:
http://www.tinywebgallery.com/blog/advanced-iframe/free-iframe-checker

Best, Michael

Author:  teracomp [ 31. Jul 2017, 18:53 ]
Post subject:  Re: JavaScript Conflict -- AngularJS

Sorry for the delayed response, I've been out of town.

I can reproduce the problem at you iframe checker site using this url: http://plantertools.com/dm5/app/

The headers pass, but the Check Frame Killer Script demonstrates the error.

1. Click Register
2. Try to enter more than one character in the password field

As soon as you enter one character, you're done. You have to click back into the text box to continue.
For first and last name, you can type two characters, but once again, you have to click back in the text box to continue
Church name only gets one character before you have to click in the box again.

If you go directly to the url, you'll see it works fine.

Author:  TinyWebGallery [ 31. Jul 2017, 21:14 ]
Post subject:  Re: JavaScript Conflict -- AngularJS

But can you also reproduce if if the ai_external.js is not included?
Because the free iframe checker page has no plugin code on this page.

Best, Michael

Page 1 of 1 All times are UTC + 1 hour [ DST ]
Powered by phpBB® Forum Software © phpBB Group
http://www.phpbb.com/