automatically resizing textarea (IE problem)

arashamiri · Nov 29, 2005

Hi, I wrote an auto resizing textarea:

function myMax(anumber, another) {
if (anumber > another) {
return anumber;
}
return another;
}

function resizeTextArea(t,minCols,minRows) {
var lines = 0;
if (t.getAttribute("cols") == null) t.setAttribute("cols",minCols);
if (t.getAttribute("rows") == null) t.setAttribute("rows",minRows);
textLine = t.value.split("\n");

// get lines of textbox
lines = t.value.split("\n").length;

// get longest row of textbox.
var max = 0;

for (i=0;i < textLine.length;i++) {
if (parseInt(textLine.length) >
parseInt(t.getAttribute("cols"))) {
lines += Math.floor(parseInt(textLine.length) /
parseInt(t.getAttribute("cols"))) ;
}
}
t.setAttribute("rows",myMax(lines+1,minRows));
}

In Firefox this works really fine!

But in IE the text area grows very strange. If I add a line, after a
while there seems to be a problem with spacing.

Anybody has some ideas?
arash

arashamiri · Nov 29, 2005

btw.
you call it like this

<textarea onkeypress="resizeTextArea(this,10,2)">
here is some text....
</textarea>

gabru · Nov 30, 2005

hi arash,
check this out:

<html>
<head></head>

<body>
<script>
function getMax(anumber, another) {
return((anumber > another) ? anumber : another);
}

/*****************************************************************************
* @SDESCRIPTION: automatically resizes a textarea depending on the
input
* @DESCRIPTION: call the function in the onkeyup-event of the tarea.
* @PARAM: t [textarea]: the textarea you want to handle
* @PARAM: minRows [int]: minimum amount of rows
* @PARAM: minCols [int], OPTIONAL: minimum amount of columns.
*****************************************************************************/
function resizeTextArea(t, minRows, minCols) {
t.rows = minRows;
t.setAttribute("wrap", "off");
t.style.overflow = "auto";

lines = t.value.split("\n");

if (arguments.length > 2) {
t.cols = minCols;
maxChars = lines[0].length;
for(i = 1; i < lines.length; i++) {
currentLength = lines.length;
if (currentLength > maxChars) maxChars = currentLength;
}
t.cols = getMax(maxChars, minCols);
}
t.rows = getMax(lines.length + 1, minRows);
}
</script>

<textarea onkeyup="resizeTextArea(this, 10);"></textarea>
<textarea onkeyup="resizeTextArea(this, 10, 5);"></textarea>
</body>
</html>

Thomas 'PointedEars' Lahn · Nov 30, 2005

gabru said:
<html>
<head></head>

<body>
<script>

Not at all Valid HTML. said:
function getMax(anumber, another) {
return((anumber > another) ? anumber : another);
}

Math.max() exists since the very first versions of JavaScript
and JScript, and it was specified in ECMAScript Edition 1.

[top post]

<URL:http://jibbering.com/faq/faq_notes/pots1.html>

PointedEars

Self-resizing textarea	2	Nov 24, 2006
I am trying to make an audio player, how do I get the selected file to be playable?	5	Mar 29, 2022
dynamically resizing height of textarea of known width	6	Mar 12, 2007
Issue with textbox script?	0	Sep 5, 2022
TEXTAREA bug in Mozilla?	10	Dec 3, 2007
sorting a textarea.	8	Nov 2, 2008
Textarea code	1	Oct 10, 2006
Problem with JavaScript in IE	2	Mar 11, 2007

automatically resizing textarea (IE problem)

arashamiri

arashamiri

gabru

Thomas 'PointedEars' Lahn

Ask a Question

Similar Threads

Members online

Forum statistics

Latest Threads