4

When a drupal form fails validation, it is redrawn with the elements that failed validation surrounded in a red border. Drupal does this by adding the error class to the input elements, and specifing a 2px red border on input.error elements in system.css.

Without modifying this stylesheet, how can I remove the red border on a specific form only, while using the default behavior on the rest of the site?

I believe the solution might require using a custom theme_form_element, but I can't figure out how to customize a single form only.

Note that I would like to do this without having to resort to this jQuery trick (which does work):

$("#edit-name").removeClass('error');
Rob Crowell
  • 1,447
  • 3
  • 15
  • 25
  • While I can change the border color for these specific elements in CSS, I can't get back to the default border for the `input` elements. So I could make the border green instead of red, but I can't get the normal browser style back. So unless I'm missing something obvious, I don't think a pure-CSS solution exists for this particular problem. – Rob Crowell Apr 30 '10 at 16:51

2 Answers2

2

You will need to remove the error class from the form items. This can be done by overwriting the theme functions, in theme_textfield, theme_textarea ... (there is one for each type)

Take a look at $element['#attributes']['class'] which contains the error class.

EDIT
To do it for a specific form element or form you can use the #theme attribute or either form or element you want to change the theming function for.

googletorp
  • 33,075
  • 15
  • 67
  • 82
  • Can this be done inside of a module? I seem to be having some trouble getting it to work. – Rob Crowell May 04 '10 at 04:58
  • Your method works (putting it in the theme), but it modifies all forms on my site instead of just a specific one. I think I will stick with my jQuery solution for now, even though I don't like it. Thanks for your help though! – Rob Crowell May 04 '10 at 17:38
0

The easiest way is not to try to modify the markup Drupal is spotting out, but instead to change the styles assocaited with the error class.

You can do that without modifying system.css. Simply add a new stylesheet in your theme (or using an existing one!). Use the Cascading nature of CSS to change the way elements with errors appear. Add something like:

.error {
  border: 0;
}

... and you are done.

To target only one specific form, add another selector, like so:

#my-specific-form .error {
  border: 0;
}
jenlampton
  • 315
  • 2
  • 7