CP form: add error class to lable --> NOT only input

If you have created additional (non official) documentation or tutorials or something like that please post this here
Post Reply
User avatar
Jensensen
Posts: 2995
Joined: Tue 17. Oct 2006, 21:11
Location: auf der mlauer

CP form: add error class to lable --> NOT only input

Post by Jensensen » Mon 24. May 2010, 01:02

I spent years and hours finding a solution for the following problem that:

with CP form you can add classes only to input fields.

And in case of errors:
a) the error messages appears solely - isolated.
b) the CSS class 'error' is applied only to input fields

Error tags are never applied to labels.


Because of that there are some limitations:
a) you only can take an affect on the styling of the input field
b) or the [isolated] error messages

but you cannot change or edit <label>


What do I want to have in case of errors:
a certain color of the label tag

Today I stumbled over the solution:
THAT'S THE WAY YOU CAN DO:
in your custom form template

Code: Select all

<label for="email"[IF_ERROR] class="MYerror"[/IF_ERROR]>E-Mail<strong>*</strong></label>{email}
I can't explain how it works - but it works well.
You need the input field have set marked 'required'.


Output HTML:

Code: Select all

<label for="email" class="MYerror">E-Mail<strong>*</strong></label><input type="text" name="email" id="email" value="" class="error" />

useful CSS now available:

Code: Select all

label.MYerror ....aus die maus
Yeah, happy, palim, dingsbums-2-3...[4-music playing]
{so_much} | Knick-Knack. | GitHub
Umlaute im URL sind meistens immer Kacke.

User avatar
update
Moderator
Posts: 6394
Joined: Mon 10. Jan 2005, 17:29
Location: germany / outdoor

Re: CP form: add error class to lable --> NOT only input

Post by update » Mon 24. May 2010, 17:41

Great :D
It's mostly all about webdesign, logo design, new and old pages refresh, print BUT slowly switching to be supporter for the band Mykket Morton. Visit Mykket Morton on FB. Listen Mykket Morton and live videos on youtube.

Post Reply