click out the hidden textbox.

JavaScript and client side scripting.

Moderator: General Moderators

Post Reply
valen53
Forum Contributor
Posts: 137
Joined: Tue Aug 27, 2002 9:29 am

click out the hidden textbox.

Post by valen53 »

i have a transaction form. B'cos too many textbox in the form, i hope that some of the textbox can be hidden, but will show a link or title for click out the hidden textbox. If dunwant to used, click again to hidden it.

any source can refer ?

thank's reply
zenabi
Forum Commoner
Posts: 84
Joined: Mon Sep 08, 2003 5:26 am
Location: UK

Post by zenabi »

User avatar
Chris Corbyn
Breakbeat Nuttzer
Posts: 13098
Joined: Wed Mar 24, 2004 7:57 am
Location: Melbourne, Australia

Post by Chris Corbyn »

:?: :?:

You mean... how do you hide a textbox?

You could use some tricky DOM scripting (a bit advanced perhaps).

Or get there abouts the same effect by just chaging the display from none to block.

Code: Select all

<script type=&quote;text/javascript&quote;>
function toggleON() {
	document.getElementById('showHide').style.display = 'block';
	document.getElementById('toggleLink').innerHTML = '<a href=&quote;javascript:toggleOFF()&quote;>Hide text box</a>';
}
function toggleOFF() {
	document.getElementById('showHide').style.display = 'none';
	document.getElementById('toggleLink').innerHTML = '<a href=&quote;javascript:toggleON()&quote;>Show text box</a>';
}
</script>

<span id=&quote;toggleLink&quote;><a href=&quote;javascript:toggleON()&quote;>Show text box</a></span>
<form>
<div id=&quote;showHide&quote; style=&quote;width:400px; height:200px; display:none&quote;>
<textarea style=&quote;width:100%; height:100%&quote;>Text here</textarea>
</div>
HTML Content here
</form>
valen53
Forum Contributor
Posts: 137
Joined: Tue Aug 27, 2002 9:29 am

Post by valen53 »

thanks for reply.

Its Quite useful.

In win XP2, for setting firewall there got menu i wanted.
Just like i click the title, the menu will close up, click again, menu will opened.

any website or source can i refer do ?

Thank you
User avatar
n00b Saibot
DevNet Resident
Posts: 1452
Joined: Fri Dec 24, 2004 2:59 am
Location: Lucknow, UP, India
Contact:

Post by n00b Saibot »

This is achieved in following way

Code: Select all

<script>
function doIt()
{
if(document.getElementById('menu').display == &quote;none&quote;)
  document.getElementById('menu').display = &quote;&quote;;
else
  document.getElementById('menu').display = &quote;none&quote;;
}
</script>
<p onclick=&quote;doIt()&quote;>Show / Hide Menu</p>
<div id=&quote;menu&quote;>
<ol>
<li>One
<li>Two
<li>Three
<li>Four
<li>Five
</ul>
</div>
Put the above code in HTML file and try it out ;)

PS:d11wtq, these are my favorite ones ... JS ... ;)
valen53
Forum Contributor
Posts: 137
Joined: Tue Aug 27, 2002 9:29 am

Post by valen53 »

Thank you.
Post Reply