.style.backgroundColor doesnt work well in IE???

Please support our JavaScript / DHTML / AJAX advertiser: PostgreSQL or MySQL? Compare and contrast the two most popular open source databases
Thread Solved

Join Date: Feb 2008
Posts: 51
Reputation: vedmack is an unknown quantity at this point 
Solved Threads: 0
vedmack vedmack is offline Offline
Junior Poster in Training

.style.backgroundColor doesnt work well in IE???

 
0
  #1
Feb 27th, 2008
Hi i have a form which holds several Inputs of type text, now when im clicking on a check box it run a js script which gets each Input text element and colors its background with a color
something like this
  1. var filed=document.getElementById("one");
  2. filed.style.backgroundColor='red';
  3. filed=document.getElementById("two");
  4. filed.style.backgroundColor='red';
  5. ...
  6. ..
  7. .

This works 100% in FF, but in IE its does nothing until i click on on the the input text, and than all of them turns red....

Any one knows what can be done in this situation?

Thanks ahead.

Daniel.
Reply With Quote Quick reply to this message  
Join Date: Feb 2008
Posts: 9
Reputation: fert is an unknown quantity at this point 
Solved Threads: 1
fert's Avatar
fert fert is offline Offline
Newbie Poster

Re: .style.backgroundColor doesnt work well in IE???

 
0
  #2
Feb 27th, 2008
Try this:
  1. var filled = document.getElementById("one");
  2. filled.style.background = "red";
Reply With Quote Quick reply to this message  
Join Date: Nov 2007
Posts: 86
Reputation: sagedavis is an unknown quantity at this point 
Solved Threads: 6
sagedavis sagedavis is offline Offline
Junior Poster in Training

Re: .style.backgroundColor doesnt work well in IE???

 
0
  #3
Feb 27th, 2008
yeah, try using double quotes instead of single around the color...

if that doesn't work...
on line 3 and 4 call it filed2

Sage
Reply With Quote Quick reply to this message  
Join Date: Feb 2008
Posts: 51
Reputation: vedmack is an unknown quantity at this point 
Solved Threads: 0
vedmack vedmack is offline Offline
Junior Poster in Training

Re: .style.backgroundColor doesnt work well in IE???

 
0
  #4
Feb 28th, 2008
thx 4 the respond...
But it still doesn't work :/ its acts the same as before... and i noticed that after i click on the check box i can click anywhere on the page and only than the color of the input box changes... i even tried doing it with a single input box... same as doing it with several inputs...
And on FF it works perfect....
I tested with double quotes and single quotes, i tried .style.backgroundColor and i tried .style.background and it works well only on FF...

Any ideas left?

Thanks again....
Any other ideas?
Reply With Quote Quick reply to this message  
Join Date: Nov 2007
Posts: 86
Reputation: sagedavis is an unknown quantity at this point 
Solved Threads: 6
sagedavis sagedavis is offline Offline
Junior Poster in Training

Re: .style.backgroundColor doesnt work well in IE???

 
0
  #5
Feb 28th, 2008
this sounds like the way IE is handling your script.

Which event are you using as your trigger?
A lot of this works better by using prototype or mootools as these libraries have all of the workarounds set in place so that you don't have to worry so much about the different browsers.

I recommend learning about event.observe instead of using onclick events or onblur events within the html tag itself.

This will allow for smoother work. That and, instead of typing out document.getelementbyid("hello") all you have to type with prototype or mootools is $('hello')..

that said, IE is a little buggy when it comes to onclick events and checkboxes... It does like onfocus and onblur.

I recommend trying changing onclick to onmousedown instead to trigger the function and see if that fixes your problem. It sounds like the event is being triggered just not the way that you want it to.

Another question is, what happens when they uncheck the box (if a mistake was made). You then should change the color back to it's default state, so, you should actually do something more like
JavaScript / DHTML / AJAX Syntax (Toggle Plain Text)
  1. function changebg(){
  2. var filed=document.getElementById("one");
  3. if (filed.checked =="true"){
  4. filed.style.backgroundColor = "red";
  5. } else {
  6. filed.style.backgroundColor = "white";
  7. }
  8. }
then use this function for your mousedown event.
Sage
Reply With Quote Quick reply to this message  
Join Date: Nov 2007
Posts: 86
Reputation: sagedavis is an unknown quantity at this point 
Solved Threads: 6
sagedavis sagedavis is offline Offline
Junior Poster in Training

Re: .style.backgroundColor doesnt work well in IE???

 
0
  #6
Feb 28th, 2008
IE also might not like the "" around your id in getElementById I'm not sure though
Sage
Reply With Quote Quick reply to this message  
Join Date: Feb 2008
Posts: 51
Reputation: vedmack is an unknown quantity at this point 
Solved Threads: 0
vedmack vedmack is offline Offline
Junior Poster in Training

Re: .style.backgroundColor doesnt work well in IE???

 
0
  #7
Feb 28th, 2008
Thanks allot sagedavis!
I did changed to onmousedown as you said , and now it works on IE too....

p.s
of course my js script is more than that i posted. i do have if/else... i did it from the first time cause i wanted to color the inputs in gray so when I'm changing input to read only it will look like its disabled in FF.. so i manually imitated it in IE with coloring.... (.disabled property was bad 4 me)

Solved....
Reply With Quote Quick reply to this message  
Join Date: Feb 2008
Posts: 5
Reputation: zabindia is an unknown quantity at this point 
Solved Threads: 0
zabindia zabindia is offline Offline
Newbie Poster

Re: .style.backgroundColor doesnt work well in IE???

 
0
  #8
Feb 28th, 2008
Try this...it works both in IE & FF..with onClick as mouseEvent

function changeBgColor(){
  			var field=document.getElementById("one"); 
			var field2=document.getElementById("firstname"); 

			if (field.checked == 1)
				field2.style.backgroundColor="red";
				else 
				field2.style.backgroundColor="white";

}
	<input type="checkbox" id="one" onClick="changeBgColor()">
	<input type="text" id="firstname">
Reply With Quote Quick reply to this message  
Join Date: Feb 2008
Posts: 9
Reputation: fert is an unknown quantity at this point 
Solved Threads: 1
fert's Avatar
fert fert is offline Offline
Newbie Poster

Re: .style.backgroundColor doesnt work well in IE???

 
0
  #9
Feb 29th, 2008
Shortened..
  1. field2.style.backgroundColor = (field2.checked == 1) ? "red" : "white";
Reply With Quote Quick reply to this message  
Join Date: Jan 2007
Posts: 3,210
Reputation: MidiMagic has a spectacular aura about MidiMagic has a spectacular aura about 
Solved Threads: 165
MidiMagic's Avatar
MidiMagic MidiMagic is offline Offline
Nearly a Senior Poster

Re: .style.backgroundColor doesnt work well in IE???

 
0
  #10
Mar 1st, 2008
I had this trouble.

The problem is that IE does not update the screen until there are no scripts running.

So you need to temporarily end the script, and use setInterval to start another function after a short pause.
Daylight-saving time uses more gasoline
Reply With Quote Quick reply to this message  
Reply

This thread has been marked solved.
Perhaps start a new thread instead?
Message:



Similar Threads
Other Threads in the JavaScript / DHTML / AJAX Forum


Views: 7908 | Replies: 9
Thread Tools Search this Thread



Tag cloud for JavaScript / DHTML / AJAX
About Us | Contact Us | Advertise | DaniWeb | Acceptable Use Policy | RSS Feed

©2003 - 2009 DaniWeb® LLC