small css trick

[lcollong]

In F4 compare to F3, the validation message error goes under the field rather than inside the tooltip.
I think it's better.

Hower the alert icon goes after the text instead of before. I tried to modify the css but did not suceeed.. :-(

 

[wezetel]

Strange. I checked this on Cassiopeia, Atum and T4-framework. I always see the icon before the text..

 

[troester]

I also can see it only before the text.

Is this only with the birthday element?
Which form template? Multicol group? Pop-up form? Any custom CSS? Which settings for the labels (Above....)

Or do you have a link?

 

[lcollong]

I'm using a Jomla51 template (Jasmine51).
But I just swithed this menu to Cassiopea and does the same (see capture).
Ajax validation is on.
group layout is set to 2 columns with labels above.
You should see the link in the capture

 

[troester]

Hmm, which browser?

 

[troester]

Ok, I see it, it's not on submit but only if the ajax val is failing. Let me check.

 

[troester]

It's done in media\com_fabrik\js\element.js line 689ff (putting icon after the text).
If somebody wants to fix it...

 

[lcollong]

I'll give a try today or tomorrow

 

[troester]

For a quick workaround you can add custom CSS like
.fabrikErrorMessage .text-danger i {padding-left:5px;}

 

[lcollong]

I prefer the icon first !
My proposal of correction :

                    Fabrik.loader.stop(this.element);
                    // repeat groups in table format don't have anything to attach a tip msg to!
                    var t = this.tips();
                    if (Fabrik.bootstrapped && t.length !== 0) {
                        this.addTipMsg(msg);
                    } else {
                        var raw_msg = jQuery(msg).text();
                        a = new Element('a', {
                            'href': '#', 'class':'text-danger', 'text': raw_msg, 'events': {
                                'click': function (e) {
                                    e.stop();
                                }
                            }
                        });
//                        a.adopt(this.alertImage);
                        a.prepend(this.alertImage);
                        Fabrik.tips.attach(a);
                    }
                    errorElements[0].adopt(a);

However I'm wondering why a "<a>" element rather than a <span> as for the non ajax validation....

 

[troester]

However I'm wondering why a "<a>" element rather than a <span> as for the non ajax validation....

I didn't dare to touch this mootools, including events. I'm not sure if it's needed at all but I think this error message is also used in modal forms, so...

 

[troester]

Added.