Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > Javascript > Expanding Textbox

Reply
Thread Tools

Expanding Textbox

 
 
interfaced@gmail.com
Guest
Posts: n/a
 
      12-03-2005
Is there a way to make an autosized textbox relative to the content,
here is my attempt:
<script type="text/javascript">
function checkHeight(el){
var newrows=Math.round(Form.Element.getValue(el).lengt h/30);
el.rows=(newrows>0) ? newrows : 1;
}
</script>
<textarea style="font-size:14px;font-family:Lucida Grande, Arial,
Helvetica, sans-serif" id="description" rows="1" cols="30"
onkeydown="checkHeight(this);"></textarea>
<input type="button" onclick="checkHeight($('description'))"
value="test" />


I just wish there was a way to get the scrollheight of the text(rather
than the height of the textbox)

 
Reply With Quote
 
 
 
 
interfaced@gmail.com
Guest
Posts: n/a
 
      12-05-2005
Here is another shot at it:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"
/>
<title>Expanding Textbox</title>
<script src="scriptaculous/prototype.js"
type="text/javascript"></script>
<style type="text/css" media="screen">
#description, #description-ghost{
font-size:14px;
font-family:Lucida Grande, Arial, Helvetica, sans-serif;
width:300px;
padding:4px;

}
#description-ghost{
width:280px;
}
</style>

</head>

<body>
<script type="text/javascript">
function checkHeight(el){
var ghost=$('description-ghost');
var content=Form.Element.getValue(el);

content = content.replace ( /\ \ /g, "&nbsp;&nbsp;" ) ;
content = content.replace ( /\&nbsp;\ /g, "&nbsp;&nbsp;" ) ;
ghost.innerHTML=content;
ghost.style.display='block'

var h=Element.getHeight(ghost);
ghost.style.display='none'
if(h>10) el.style.height=h+"px"

}
</script>
<textarea id="description" onkeyup="checkHeight(this);"></textarea>
<div id="description-ghost"
style="display:none;font-size:14px;font-family:Lucida Grande, Arial,
Helvetica, sans-serif"></div>
</body>
</html>

http://www.velocityreviews.com/forums/(E-Mail Removed) wrote:
> Is there a way to make an autosized textbox relative to the content,
> here is my attempt:
> <script type="text/javascript">
> function checkHeight(el){
> var newrows=Math.round(Form.Element.getValue(el).lengt h/30);
> el.rows=(newrows>0) ? newrows : 1;
> }
> </script>
> <textarea style="font-size:14px;font-family:Lucida Grande, Arial,
> Helvetica, sans-serif" id="description" rows="1" cols="30"
> onkeydown="checkHeight(this);"></textarea>
> <input type="button" onclick="checkHeight($('description'))"
> value="test" />
>
>
> I just wish there was a way to get the scrollheight of the text(rather
> than the height of the textbox)


 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
Expanding Wireless Network =?Utf-8?B?QnJpYW4=?= Wireless Networking 3 11-11-2005 08:17 PM
Dynamic Size for Text Box - Expanding more than the relative size Madhanmohan S ASP .Net 5 09-03-2004 06:28 AM
Expanding scalar hash element in array ref. Dmitri Zakharov Perl 2 06-11-2004 11:11 AM
TreeView dynamic DataBinding and problem with Expanding volts ASP .Net 0 04-07-2004 10:00 AM
Expanding a <div> Kevin Quigley ASP .Net 2 12-10-2003 12:00 PM



Advertisments