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 TouchToneTommy on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

change textbox attributes on click

Status
Not open for further replies.

jmcg

Technical User
Jun 30, 2000
223
GB
I am trying to get a bit of code that will change the background color and change the size of a textbox when it is clicked on.
The Javscript function is (for just the color):
Code:
function changeInput(this) {
	document.getElementById(this).style.backgroundcolor = "silver" ;
	}
and the code to call it is:
Code:
<input type="text" name="#Contact_First_Name#" value='#Contact_First_Name#' size=#len(Contact_First_Name)+4# onClick=" changeInput(this) return true;">

The error I get is object not defined.
 
Sorry the code to call should read:
Code:
<input type="text" name="Contact_First_Name" value='#Contact_First_Name#' size=#len(Contact_First_Name)+4# onClick=" changeInput(this);">
 
Some changes - this is a reserved word, and you got the case wrong for setting the style:
Code:
function changeInput([!]oElement[/!]) {
    document.getElementById([!]oElement[/!]).style.background[!]C[/!]olor = "silver" ;
    }

You might want to look at the input - you seem to have mixed up some other (non-client side) code in the size attribute. You ought to wrap the contents of the size attribute in speech marks (size="12").

I don't know what else is broken... but those steps need to be done first.

Cheers,
Jeff

[tt]Visit my blog [!]@[/!] Visit Code Couch [!]@[/!] [/tt]

Make sure your web page and css validates properly against the doctype you have chosen - before you attempt to debug a problem!

FAQ216-6094
 
[tt]function changeInput([red]obj[/red]) { //"this" is special reserved word
[red]obj[/red].style.background[red]C[/red]olor = "silver" ;
}
[/tt]
 
Code:
function changeInput([b]obj[/b]) {
    document.getElementById([b]this[COLOR=red].id[/color][/b]).style.background[s]color[/s] = "silver" ;
    }


Code:
<input type="text" [b]id="#Contact_First_Name#"[/b] name="#Contact_First_Name#" value='#Contact_First_Name#' size=#len(Contact_First_Name)+4# onClick=" changeInput(this)[b][COLOR=red];[/color][/b]return true;">


TIP: trying googling the answer before posting, you'll find that more times than not someone else somewhere has had the same request and posted an answer online.
----
I have recently been semi-converted to ensuring all my code (well most of it) works in both javascript and non-javascript enabled browsers
 
^ sorry

Code:
function changeInput(obj) {
    document.getElementById([b]obj.id[/b]).style.backgroundcolor = "silver" ;
    }

TIP: trying googling the answer before posting, you'll find that more times than not someone else somewhere has had the same request and posted an answer online.
----
I have recently been semi-converted to ensuring all my code (well most of it) works in both javascript and non-javascript enabled browsers
 
Got it working with
Code:
function changeInput(obj) {
	obj.style.background = "99ccff" ;
	}
Code:
<input type="text" name="Contact_First_Name" value='#Contact_First_Name#' size='#len(Contact_First_Name)+4#' onClick="changeInput(this);return true;">

Thakns to all for the help
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top