I am trying to color the background color of input fields on a page using javascript
function notifyDuplicates() {
var el = document.getElementsByTagName('input');
for (counter1 = 0; counter1 < el.length; counter1++) {
var firstEl = el[counter1];
if ((firstEl.type == 'text') && (firstEl.id.endsWith('TextBox1'))) {
for (counter2 = 0; counter2 < el.length; counter2++) {
var secondEl = el[counter2];
firstEl.style.background = ((firstEl.value == secondEl.value) && (counter1!=counter2))?'#FF8684':'#FFFFFF';
secondEl.style.background = ((firstEl.value == secondEl.value) && (counter2!=counter1))?'#FF8684':'#FFFFFF';
}
}
}
}
If my page looks like
Column1 Column2
Value1 Value2
Value1 Value3
The background for the element of Value1 ends up being colored red, but the the other Value1 Element does not. Thoughts?
Give an ID to everything and use GetElementByID
Or use jQuery (http://www.jquery.com), the bestest javascript thingamajig EVER.
$('input[type=text]').css('background-color', 'red');
This is a sample of turning all input text boxes to a background-color of red.
If you need more specificity, I suggest setting IDs:
if ($('#elem1').val() != $('#elem2').val())
$('#elem1').css('background-color', 'red);
Or you could always use this awesome jquery validation plugin (http://bassistance.de/jquery-plugins/jquery-plugin-validation/).
Moral of the story: jQuery is the shit. :)
Did some work on it and found that It was actually coloring the boxes correctly, but I had failed logic and the loop would uncolor. Will look into the jquery. I have tried changing my ID's and going through just them but, .net seems to do some obfuscating on that part and even though I try to put <%=inputobject.clientid%> the compiler seems to hate it and blows up every time.
Thanks for the suggestions, I looked into jQuery and it does look like the way of things for the future, but atm I dont know enough about it to feel comfortable plugging something. I fixed my logic I think. I added a check to make sure the boxes weren't already flagged(red).
function notifyDuplicates() {
var el = document.getElementsByTagName('input');
for (counter1 = 0; counter1 < el.length; counter1++) {
var firstEl = el[counter1];
if ((firstEl.type == 'text') && (firstEl.id.endsWith('TextBox1')==true)) {
for (counter2 = 0; counter2 < el.length; counter2++) {
var secondEl = el[counter2];
if ((firstEl.value == secondEl.value) &&
((firstEl.style.background != '#FF8684') || (secondEl.style.background != '#FF8684')) &&
(counter1!=counter2)) {
firstEl.style.background = '#FF8684';
secondEl.style.background = '#FF8684';
break;
} else {
firstEl.style.background = '#FFFFFF';
secondEl.style.background = '#FFFFFF';
}
}
}
}
}
Quote from: MyndFyre on October 04, 2009, 02:45 AMOr use jQuery (http://www.jquery.com), the bestest javascript thingamajig EVER.
Agree. Might also check out the Manning publishers book "jQuery in Action" (http://www.manning.com/bibeault/).
Since my last post, I have in fact started using jQuery, and the description on the page Grok posted is right: I fell in love.
Anyway, I just noticed that you're checking with type AND id fields, which means either A) you're overdoing it or B) not using id properly. Remember that id is supposed to be unique to each element.
Yes, you're not allowed to reuse ids. I don't think any browsers will expressly forbid you from doing it, but it's a violation of some standard.
If you try to use GetElementById when you've reused ids, you'll get migraines.
Quote from: rabbit on December 01, 2009, 07:33 AM
Since my last post, I have in fact started using jQuery, and the description on the page Grok posted is right: I fell in love.
Anyway, I just noticed that you're checking with type AND id fields, which means either A) you're overdoing it or B) not using id properly. Remember that id is supposed to be unique to each element.
Most of my dev code contains alot of sanity checks. So overdoing yes. Yeah my id's are unique.
Sometimes you can approach insane from a different direction. If your IDs are unique, you don't need to check the type.
oh, yeah that does make some sense.
Quote from: rabbit on December 02, 2009, 02:14 PM
Sometimes you can approach insane from a different direction.
If you were a famous person, this would get printed and catch on.
Quote from: Grok on December 03, 2009, 12:46 AM
Quote from: rabbit on December 02, 2009, 02:14 PM
Sometimes you can approach insane from a different direction.
If you were a famous person, this would get printed and catch on.
Well that's cool...I stole it from Terry Pratchett :P