I HIGHLIGHT text onclick. Fine! How do I Unhighlight onclick again?

[mb22]

function DoHighlight(id) {
var item = document.getElementById(id);
item.select();
//onclick="this.select()"
}

How do I test to see if the field is highlighted first....
If not then highlight it
else
Unhighlight (... take off highlight and just position the cursor)

if (item.select())
item.unselect()
else
item.select() ??????????????????????

 

[mwolf00]

<script>
function DoHighlight(id) {
  var item = document.getElementById(id);
  if (item.className == "highlight){
    item.className = "normal"
  }
  else{
    item.className = "highlight"
  }
}
</script>

<style>
  .highlight {background-color: yellow;}
  .normal {background-color: white;}
</style>

Programming today is a race between software engineers striving to build better and bigger idiot-proof programs, and the Universe trying to produce bigger and better idiots. So far, the Universe is winning. - Rick Cook (No, I'm not Rick)

 

[mb22]

I'm confused .... do I have to apply the style
<style>
.highlight {background-color: yellow;}
.normal {background-color: white;}
</style>

to all my textboxes .....? how would I do that?

This is what I have in my pageload for each ASP.NET textbox

TextBox1.Attributes("onclick") = "javascript:return DoHighlight('TextBox1');"

 

[mwolf00]

The easiest way to apply the style you want without having to worry about which browser is in use is by changing the classname. I haven't worked with asp.net, but you shouldn't have to apply the classname to the textbox as you create it. My code allows the object to have no classname when it is passed.

Programming today is a race between software engineers striving to build better and bigger idiot-proof programs, and the Universe trying to produce bigger and better idiots. So far, the Universe is winning. - Rick Cook (No, I'm not Rick)

 

[mb22]

OK I see what you did!. However I'm sorry .. I think I did not explain the issue well ... I mean I want to SELECT the text (item.select()) ..and then UNSELECT the text (just return to like a normal click in the textbox without SELECTING the text in the field) ... NOT highlight!!!!

I want to toggle between the first onclick event (item.select()) ... and then the second time I click again ..take out the SELECT and make it look like a normal click.

Thanks ....... I hope I did better explaining!

 

[LFI]

I once used something similar with onmouseover and onmouseout events (highlighting and unhighlighting with each. I think a variation of what I did that might work for you might be something along the lines of:

var HIGHLIGHTED_BG_COLOR = 'black';
var HIGHLIGHTED_TEXT_COLOR = 'white';
var UNSELECTED_BG_COLOR = 'transparent';
var UNSELECTED_TEXT_COLOR = 'black';
function mouseClickAction(clickedObject)
{
 if(clickedObject.style.backgroundColor == HIGHLIGHTED_BG_COLOR)
 {
  clickedObject.style.backgroundColor = UNSELECTED_BG_COLOR;
  clickedObject.style.color = UNSELECTED_TEXT_COLOR;
 }
 else
 {
  clickedObject.style.backgroundColor = HIGHLIGHTED_BG_COLOR;
  clickedObject.style.color = HIGHLIGHTED_TEXT_COLOR;
 }
}//end mouseOutAction(...)

Then whatever is being clicked would have an onclick event of: onclick='mouseClickAction(this);'

'hope this works/helps!

--Dave

 

[mwolf00]

haven't worked with select but try this...

if (item.select){
item.select = false
}
else{
item.select = true
}

Programming today is a race between software engineers striving to build better and bigger idiot-proof programs, and the Universe trying to produce bigger and better idiots. So far, the Universe is winning. - Rick Cook (No, I'm not Rick)

 

[jemminger]

mb22,

is blur() what you're looking for?

here's an example:

<form>
	<input type="text" name="foo" value="text" />
	<input type="button"
		value="select"
		onclick="this.form.foo.select();" />
	<input type="button"
		value="unselect"
		onclick="this.form.foo.blur();" />
</form>

=========================================================
-jeff

http://www.jeffemminger.com

try { succeed(); } catch(E) { tryAgain(); } finally { rtfm(); }

 

[mb22]

Close but not quite.... YES onblur does UNSELECT it but it loses focus .... so I used item.focus() and combined withh the other suggestions.. but thanks guys?

function DoHighlight(id) {
var item = document.getElementById(id);
if (item.className == "highlight"){
item.className = "normal";
item.focus();
}
else{
item.className = "highlight";
item.select();
}
}