Jump to content

Backgroud Color Of A Disabled Inpu Field


Recommended Posts

Hello,I made this litttle form with name,lastname and email input text fields, and i wrote some javascript to disable the email input field until the other 2 have been filled out, and it works, but it is the same color as the other two when the page loads, so i wanted to change that so it is "silver" when the pag estarts(until it becomes enabled), but i can't figure it out.This is what i tried:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>Untitled Document</title><script language="javascript" type="text/javascript">function enable_email() { with(document.forms.contact) { if (fname.value.length > 0 && lname.value.length) { email.disabled = false } } } function changebg(element) { with (document.forms.contact) { if (email.disabled == true) { element.style.backgroundColor = 'silver' } } } </script> </head><body><form action="" method="post" name="contact"><p>First Name: <input type="text" name="fname" onchange="enable_email()" /></p><p>Last Name: <input type="text" name="lname" onchange="enable_email()" /></p><p>Email: <input type="text" name="email" disabled="disabled" onload="changebg(this)" /><br /><input type="submit" value="submit" /><input type="reset" value="reset" /></form> </body></html>so i have made the function bgcolor and tried adding it to the emal input field "onload", but it's not working.any suggestions ?Thanks

Link to comment
Share on other sites

Well, since it's disabled by default when the page loads, why not use CSS?

<p>Email: <input type="text" name="email" disabled="disabled" style="background:silver;" />

Then just change it to white, or whatever the color is with JavaScript.

if (fname.value.length > 0 && lname.value.length > 0) {  email.disabled = false;  email.style.backgroundColor = 'white';}

Also, I think you meant to put lname.value.length > 0. So it also checks if the length of the last name is greater than zero.

Edited by RahXephon
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Create New...