Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations Chris Miller on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Output Text Color

Status
Not open for further replies.

Enkrypted

Technical User
Sep 18, 2002
663
US
I have a form validation script for a website contact form. If a specific input field is left blank, it prompts the user with an error message. What I would like to do is to make the output text a specific color. I'm not exactly sure how to go about doing this though in the actual script file. The portion of text I want to display a different color is below:

Code:
var     s_error_field_empty = "Please enter a value for this field.";

Does anyone know what I would need to do to get the "Please enter a value for this field." to display in a different color other than black?

Enkrypted
A+
 
How about:

Code:
var     s_error_field_empty = "<span style='color:red'>Please enter a value for this field.</span>";

Chris
 
Or

css:
Code:
[green].error { color: red; }[/green]

javascript:
Code:
var s_error_field_empty = '<span [green]class="error"[/green]>Please enter a value for this field</span>';

Benifit: You can change the appearance of all your error messages at once.

Then you need to write the message to the HTML in the appropriate spot.

Otherwise you could have the message already in the html, and toggle it's class in javascript:

css:
Code:
.hidden { display: none; }
.error { display: inline; color: red; }

HTML:
Code:
<span id="inputempty" class="hidden">Please enter a value for this field.</span>

Javascript (to execute on error):
Code:
document.getElementById('inputempty').className = 'error';

Javascript (to execute when error fixed):
Code:
document.getElementById('inputempty').className = 'hidden';

Lastly, HTML5 and CSS3 removes the need for JavaScript in newest browsers, but isn't wide spread yet. Here's an article about it:

[plug=shameless]
[/plug]
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top