Validation not working on IE9

Hi,

Validation of my forms does not work in IE9. The form gets send without any validation. I works fine in Chrome, Safari, Opera. Even with tmpl=component added to the URL to avoid template issues it still doen't work on IE9.

Turning on the System - Mootools Upgrade plugin only causes the other browsers to ignore te validation as well. I fund a mootool.js on this forum, but this file causes my backend menu to stop working.

How do I getthe form(s) to validate propperly in IE9?

Thanks!

Hi jj135 ,

Please upgrade to Joomla! 1.5.23 if you haven't already done so; the earlier versions don't work correctly with IE9.

Bob

Hi Bob, I'm already on 1.5.23.

Hi jj35,

Please post a link to the form so we can take a quick look.

Bob

See my pm to you...

Hi jj135,

Nothing visible so far ??

Bob

I disabled the password protection. Can you see the form/site now?

Some additional info: I'm using some jquery in noConflict mode on my template.

Hi, I discovered that not using the jquery in the template makes the form validation work OK in IE7 / IE8. But still not in IE9.

Is there a way to make form validation work with jquery in IE?
And why does it work in IE7 an IE8 when jquery is not used, but not in IE9?

Thanks ;-)

Hi jj135,

It wasn't that I couldn't see the site . . . I haven't received the PM with the URL :-(

Bob

OK, this is the URL: http://puur2.nl/overig/contact.html

I just installed the SCjQuery plugin for Joomla.Now the validation workst fine in IE 7 and IE8. So now I am able to use jQuery in combination with the validation of chronoforms.

But still no validation in IE9😟 .

Jip.

Hi jj135,

I haven't managed to pin it down yet :-(

There's still some kind of conflict because the form linked directly validates OK (though no error messages show).

I'll look again later.

Bob

Ok, so this is only a problem when used through the plugin... :? I'll wait and see what you come up with. Thanks so far!

Hi, i've got the same problem with IE9 and Joomla 1.5.23. Anybody an idea, or already solved?

Hi casper99, I don't think this is solved yet. I'm still waiting for Bob to check this out.

Hi Bob,

Have you had time to investigate this issue further? Any news? Thanks!

I can confirm that I'm having the same issue with chronoforms 3.2 and joomla 1.5.23😟

I found a solution that maybe is not the best solution, but it works for me until a better solution comes out .

You have to put the following between the header tags of your template:

<meta http-equiv="X-UA-Compatible" content="IE=8" />
<meta http-equiv="X-UA-Compatible" content="IE=7" />

I found the solution here:
http://alanstorm.com/ie9_fix_for_magento

Hope it can help some desperate soul like me🙂

Hi!

Wanted to try the solution marcielo offered. But after checking if the problem was still there... It wasn't! Validation works fine now. Did not change anything.... Well, Upgraded sh404sef to the latest version. Maybe IE9 was updated of the sh404sef upgrade helped. Don't know. marcielo, do you use sh404sef? If yes, and you're up to date with IE9, could you check this out? Would be good to know if sh404sef was the problem.

Thanks!

Yes, I actually have a very old version of sh404sef and didn't give it a thought! But you can very well be right sh404sef causing the issue. I'll be back when I tested it. Thank you for reporting back🙂

Hello

I have the same issue, i ve tried to enable and disable js files on the page, used the magento thing, nothing validates on ie9 !

tks

Hi schlogo,

Please post a link to the form so I can take a quick look.

Bob

there you go

http://www.le-diagnostic-dpe.info/dpe-dans-les-petites-annonces-mise-au-point

For information, i ve tried without any other js, with and without mootools 1.1 and 1.2

tks

Hi schlogo,

Most of the validated inputs are missing the type='text' attribute which is technically required in HTML. While most browsers will assume it is there ChronoForms uses it to identify the input type.

There is also some junk in the Nom input and I think that the ids for the checkbox array are mostly invalid as they contain e.g. é and special characters are not allowed in names and ids.

Bob

Hello

tks for your help Greyhead. Nothing you ve mentionned actually fixed it but after reading your answer i ve decided to check the w3c validation. I ve fixed all the errors.

The last error of the w3c validator i got to fix was about the form tag:

document type does not allow element "form" here; missing one of "object", "applet", "map", "iframe", "ins", "del" start-tag

I looked at my document and noticed that jce added <p> tags around the plugin code.I removed the p tags, w3c validation works and so does chronoforms validation in ie9 ... I can reproduce it on 5 websites

In action :
without p tags :
http://www.le-diagnostic-dpe.info/le-diagnostic-de-performance-energetique-dpe

with p tags
http://www.le-diagnostic-dpe.info/le-dpe-validite-du-diagnostic-dpe

I hope this will help someone !

Hi schlogo,

Well found. I'd forgotten about the <p> tag problem - we have seen that before with the plug-in.

I copied the form source to a new form here and found that only the email field validated on my test site - that's what led me to the missing type attribute.

Bob

Just thought I'd add my bit. Effectively, inserting the chrono code via the JCE editor, I noticed that it would insert the code between p slash p tag. I went in code mode and I replaced p with div saved and Voila!!! All my forms started validating ok in IE9.
Tks for the hints guys.🙂

Bob,

I'm having the same problem with IE9 validation. I've included the suggested tag <meta http-equiv="X-UA-Compatible" content="IE=8"> and now the validation is working. I'm on Joomla version 1.5.23 which has patched the MooTools to version 1.2.5 and have Chronoforms V3.2 installed. Is this the best solution to this problem or is there something else I should be doing.

Thanks in advance for your help!

Hi jeshultz,

I don't know of a better solution :-(

I suspect that there is something in the FormCheck code that could be tweaked to remove the problem but I don't know where to look.

Here's a code snippet that I wrote yesterday to put form pages into IE8 emulation mode. This was for ChronoForms v3 + MooTools 1.2.5 but it should work just as well in a Custom code block in CFv4.

<?php
// Force IE9 to run in IE8 emulation mode to avoid JS errors with Mootools 1.2.5
jimport('joomla.environment.browser');
$browser =& JBrowser::getInstance();
if ( $browser->getBrowser() == 'msie' && $browser->getMajor() == 9 ) {
	$doc =& JFactory::getDocument();
	$doc->setMetaData( 'X-UA-Compatible', 'IE=EmulateIE8', true );
}
?>

Bob

Thanks for your speedy reply; I have your implemented your code snippet and it is working great!

[...] Here's a code snippet that I wrote yesterday to put form pages into IE8 emulation mode. This was for ChronoForms v3 + MooTools 1.2.5 but it should work just as well in a Custom code block in CFv4.

<?php
// Force IE9 to run in IE8 emulation mode to avoid JS errors with Mootools 1.2.5
jimport('joomla.environment.browser');
$browser =& JBrowser::getInstance();
if ( $browser->getBrowser() == 'msie' && $browser->getMajor() == 9 ) {
	$doc =& JFactory::getDocument();
	$doc->setMetaData( 'X-UA-Compatible', 'IE=EmulateIE8', true );
}
?>

Bob

Hi Bob!

Just a little question... could you please tell me in which file and where in that file do I past this code snippet? I'm using Joomla 1.6.6 and CF V4 RC1.9 and I too have this validation problem in IE9. In Firefox, if I clic in a form field, write nothing and then skip to the next one, I get a little pop up telling me that the field is required... but in IE9, nothing like this happens. No validation what so ever. 😢

Hi Denis,

If you open the From in the Wizard Edit, click the Events tab and drag a Custom Code action into the On Load event. It should probably go before the Show HTML action. Open the Custom Code configuration and copy and paste the snippet into the Code box. Click the Save tab; clode the windoe, then click the Save or Save & Close icon in the Toolbar.

Bob

Hi Bob,

Did exactly what you said and still no validation in IE9. Everything works fine in FireFox and Google Chrome... see screen captures bellow:

FireFox Email validation:


Google Chrome Email validation:


IE9 Email validation not working:


Can you please help me on that?! 😟

Thanks,
Denis.

P.S. Why isn't there a rule to follow so that all web browsers would read the same language?! Sigh! Would stop the developers headache! 😫

Hi Denis L.

Please post a link to the form so I can take a quick look.

Bob

Hi Bob,

My site is closed because under construction but I'll send you a temporary user account detail in PM.

Just tell me when your done with it. 8)

And thanks for your precious help!

Denis.

[EDIT] PM Sent! 🙂

Hi Denis,

I think this is working OK now - please test when you can.

It took a bit of finding but in the end the problem seems to have been that you and given the name 'send' to the submit button. I changed it to 'submit' and all seems to be OK.

I don't know why this would make a difference; the error was showing up deep in the MooTools code. I can only guess that 'send' is a reserved word in MooTools, JavaScript or IE and using it was having odd side-effects.

Bob

PS For other readers - setting site Configuration to Debug loads the uncompressed version of MooTools which makes locating the error much simpler.

AAARGH! The name "Send" is something that all browsers understand except... IE. IE needs "Submit" fore a field name. Who would've known?!🙄

You're a genius!!! 😀 Works like a charm now!

Thank you very much fore your help Bob! 8)

On a side note, one thing for sure is that I will learn more about coding and errors in time so that in the future, I'll be able to find solutions and help other like you do! 🙂

Hi !

I'm interested in your issue because I have the same problem with Joomla 1.7.2 + CF last version.

I don't understand why but (on IE9) 2 forms are OK and use the JS validation, and the 3 other one doesn't...

How can you fix it ?

OH MY GOD !!!
I found the solution, if it can help someone else it's realy realy tricky to find !

When you use the CF plugin to show your form in an article be sure that it is in a DIV block and NOT in a P...

Hi Mushr00m,

Yes, IE takes a strict interpretation of the HTML rule that says the a <form> tag can't appear inside a <p> tag. Most of the other browsers tolerate this, IE doesn't.

Bob

Hi

I have 2 issues with my form

First off validation is not working in IE - I added the php code snippet, in the "Form HTML" - but still validation is not working in IE9

Second the calendar pop up is not appearing in IE.

My site URL is
http://www.rolandirelandproductregistration.com

Thanks

Dave

Hi Dave,

There's an occasional JavaScript error showing up in IE9 which says the getElementByID is not supported for the selector .tooltipimg

But I can’t see .tooltipimg anywhere in the page code and can't see what is triggering the error or why it is occasional :-(

The error doesn't seem to show up if you view the form without the template so I guess that it's a conflict with something else on the page.

Bob

Indeed it is! brought in the form of blocks, instead of P and DIV checks began to work in IE 9

OH MY GOD !!!
I found the solution, if it can help someone else it's realy realy tricky to find !

When you use the CF plugin to show your form in an article be sure that it is in a DIV block and NOT in a P...

Hi

I removed these lines of code from the template index.php file and all seems to work now

<script type="text/javascript">if ('undefined' != typeof jQuery) document._artxJQueryBackup = jQuery;</script>
<script type="text/javascript" src="<?php echo $templateUrl; ?>/jquery.js"></script>
<script type="text/javascript">jQuery.noConflict();</script>
<script type="text/javascript" src="<?php echo $templateUrl; ?>/script.js"></script>
<script type="text/javascript">if (document._artxJQueryBackup) jQuery = document._artxJQueryBackup;</script>

Thanks

Dave

Hi Bob
I am working the first time with the V4 Version of Chronoforms on Joomla 1.7. Great work!
But the form validation on IE is a liddle bit tricky! As I include also the jQuery Framework, I tried varios things but no success. I found on this post the code snippet for workarround with IE9, but it didn't work for me. I found also this blog post http://www.chronoengine.com/forums.html?cont=posts&f=26&t=66084&p=265827&hilit=validation+ie+v4#p265827, and finally found out that it seems to be some problem with the plugin! First I had a standard Joomla content menutype, the form I included with your plugin! Then I changed to menu type "Chronoforms display forms" and now the validation works also in IE9 !?

Hubert

Hi bob,

I can confirm too that the problem of the validation (and little tooltip pop-ups) not working in IE comes from the chronoforms plugin. I use the latest version of chronoforms and when I use the form displayed in the article using the {chronoforms}form{/chronoforms} code, no validation works in IE. 😟

But if I use the "Frontend view" link to see the form directly, all validation works in IE. :?

Can you please help us by fixing this issue? Or give us the code and file to modify to fix the plugin?

Thanks very much for your help!

Denis.

Hi Denis,

Please post a link to the form so I can take a quick look.

Bob

Thanks Bob for your answer... I've sent you links in PM because it's a site in development and want to keep it private for now.

You can however post the fix here for people to use since this problem seems to be happening widely.

Thanks again!

Denis.

Hi Denis,

I can see that it isn't working; but I have no idea why :-( You can try setting Relative URL to No on the form General tab, that seems to fix some problems that show up with the plug-in.

Bob

I just did that (setting Relative URL to No on the form General tab) but still... No validation in IE. 😟 Hope you can find the bug! It's really weird.

Denis

Very sorry if I bug you with that Bob... really not my intension but... man I hope you'll be able to find the fix for this plug-in bug! 😟

To me, since that on the live page the validation doesn't work in IE using the plug-in's short code (not even the captcha one) and that it works fine when you use the form's preview link clearly points in the direction of the problem... the plug-in.

The sad thing about all of this is that with no fix, anyone that uses this wonderful extension can, and most likely will, get SPAM from the IE side. 😟 Sssssht! Don't say it to loud so the IE SPAMMERs can here this! :wink:

Will be waiting for solutions and thanks again for your help... greatly appreciated.

Denis.

Any news?! 😟 (just asking)

Hi Denis,

No, I haven't had time to look - ad I'm not sure where to look. I know that Max has plug-in problems on his to-do list and hopefully he will find a solution.

Bob

OK thanks Bob.

Will you be kind enough to post the results of Max's findings in this thread please?

Thanks again for your help!

Denis.

P.S. GO! MAX! GO! 😀

Hi Denis,

I ran a little test this morning and on my test site the plug-in is working OK in IE9 (also in IE7 & IE8 browser compatibility modes). I can understand why Max is finding this tough to track down.

On your site I see that there are two different versions of jQuery loading. I wondered if that might have some subtle effect when the plug-in is in use - maybe the loading timing is different?

Bob

Hi Bob,
Thanks for your answer.

Hi Denis,

... On your site I see that there are two different versions of jQuery loading. I wondered if that might have some subtle effect when the plug-in is in use - maybe the loading timing is different?

Bob

I'm not familiar with what your telling me unfortunately (jQuery loading) :? Do you know how to fix this issue?

Thank,

Denis.

Hi Denis,

The template on your site and/or some other extension is loading two different versions of the jQuery JavaScript library. This is known to conflict with the MooTools library that is used as standard by Joomla! and ChronoForms and has to be put into noConflict mode to avoid problems.

Because the validation works Ok when you view the form stand-alone I think that jQuery is correctly configured. But having two versions of any library is a potential source of problems.

I've written a help doc on solving jQuery problems (new today). You can get it here.

Bob

Hello,
I encountered the same problem in IE when i moved my forms into articles, to remedy, I used this in the article body :
<div>{loadposition somemodule}</div> (div instead of the default enclosing p tag)

"somemodule" refers to a ChronoForms module containing the ChronoForms form.

Also works great to "hide" a form by date assignment (after a periodic survey in my case) while keeping the article up.

Hope this helps,

M Benoit

Ha! Your a genius Mathieu! 😀

Not that Bob's solution isn't good but, using the module instead of the plug-in fixes the IE validation problem just like that, without having to temper any code in any files. I have to give a +1 for that! :mrgreen:

So What I did is put my form in Chronoforms module and gave it a custom position like Contact1 and then, I loaded the module in the article like Mathieu said, using <div>{loadposition Contact1}</div>.

To add to this, I wanted to move the form to the center of the page instead of having it aligned to the left so, I tried <div align=center>{loadposition Contact1}</div>. It did move the form in the center of the article but, it messed up all the style of the form by aligning everything to center like a text paragraph.

So, to fix that, I used this => <p style="text-align: center;"><div>{loadposition Contact1}</div></p>

Now my form is perfect and the validation works fine in IE too! 8)

Thanks all for your precious help!🙂

Denis.

Bravo !

Having the same problem with:

Internet Explorer 8 (on Windows XP)
Joomla 2.5.1
Chronoform V4 RC3.11

solved using the module instead of the plugin.
Thanks!🙂