homepage Welcome to WebmasterWorld Guest from
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member
Visit PubCon.com
Home / Forums Index / Code, Content, and Presentation / JavaScript and AJAX
Forum Library, Charter, Moderator: open

JavaScript and AJAX Forum

Javascript to update a cell and a text box

 4:22 pm on Aug 26, 2002 (gmt 0)

Can anyone tell me the javascript code to update a cell and a text box when a gif is clicked ie:

I have a table with 3 cells, each cell has a background colour, say #006699, #339966, #FF9900. Each cell has a transparent gif to click. Every time one of the gifs is clicked:
- A section of the screen (a cell or div) changes its background colour to the colour of the cell of the clicked gif.
- and the hex value for the color is writen into a text box.



 5:50 pm on Aug 26, 2002 (gmt 0)

This is rather simple using standard DOM:

function changeBgr(element, color) {
document.getElementById(element).style.backgroundColor = color;
document.form1.field1.value = color;

The cell (or div) you're changing should have the ID set:
<td id="first"> or <div id="second">,

and the text field is named "field1" and placed inside form1:

<form name="form1">
<input type="text" name="field1">

The function should be called like this:

<a href="#" onclick="changeBgr('first', '#339966')" title="click to change backgr color"><img src="transp.gif" width=... height=... border="0"></a>


 6:04 pm on Aug 26, 2002 (gmt 0)

Change it to:

<a href="javascript:changeBgr('first', '#339966');"><img....

That way, you don't break the back button or have the document jump around.


 6:56 pm on Aug 26, 2002 (gmt 0)

I forgot about page jumping up. It happens only in IE by the way. There's a fix for this:

<a href="javascript:changeBgr('first', '#339966'); return false">


 9:17 am on Aug 27, 2002 (gmt 0)

Thankyou Starway!
It will be a few days before I can try this.

Global Options:
 top home search open messages active posts  

Home / Forums Index / Code, Content, and Presentation / JavaScript and AJAX
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved