IE9 textarea Problem

Gene Wirchenko · Dec 29, 2011

Dear HTMLers:

I am working on a test page.

I have some code which adjusts the value of a textarea control
value. It eliminates extraneous spaces and newlines. This is done in
the onblur event. The correct value gets calculated and appears to be
assigned just fine.

The weirdness is that the arrow keys then do not work properly.
Repeated left arrows on some lines (bottom and close?) result in the
cursor going to the left THEN back to the end of the same line.

But it is not my code as I even see the weirdness before the
onblur code is executed.

The textarea is three rows high, and my values are longer than
that.

I have found that, if I add
onfocus="this.select;"
to the textarea control definition, it gets rid of the problem. This
comes at the expense of not being able to click right at a point in
the textarea to start modifying.

Have I found a bug? Is there a way around this?

Sincerely,

Gene Wirchenko

Adrienne Boswell · Dec 29, 2011

Gene Wirchenko said:
Dear HTMLers:

I am working on a test page.

I have some code which adjusts the value of a textarea control
value. It eliminates extraneous spaces and newlines. This is done in
the onblur event. The correct value gets calculated and appears to be
assigned just fine.

Please understand this will not work for users who have JavaScript
disabled. Never trust anything from the client, always check server
side, especially before passing values to a database.

The weirdness is that the arrow keys then do not work properly.
Repeated left arrows on some lines (bottom and close?) result in the
cursor going to the left THEN back to the end of the same line.

But it is not my code as I even see the weirdness before the
onblur code is executed.

The textarea is three rows high, and my values are longer than
that.

I have found that, if I add
onfocus="this.select;"
to the textarea control definition, it gets rid of the problem. This
comes at the expense of not being able to click right at a point in
the textarea to start modifying.

Have I found a bug? Is there a way around this?

As always, a URL would be very helpful. If you do not have a URL, check
with your ISP, a lot of them give free web space out, or check with one
of the free hosting services. If there is sensitive information, remove
it, and then publish it.

Some other things to do:

1. Validate the markup and the CSS
2. Test in other browsers and note their behaivor

Gene Wirchenko · Dec 29, 2011

Please understand this will not work for users who have JavaScript
disabled. Never trust anything from the client, always check server
side, especially before passing values to a database.

This will be part of an internal app. JavaScript will be
enabled.

Yes, I do not trust, but I still want a good front-end for the
good users. I will validate as in belt and suspenders.

As always, a URL would be very helpful. If you do not have a URL, check
with your ISP, a lot of them give free web space out, or check with one
of the free hosting services. If there is sensitive information, remove
it, and then publish it.

I do not want to add yet another variable. Here is some basic
code that can replicate the problem. I state "can", because I still
do not have a 100% lock on what causes the problem.

***** Start of Code *****
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>

<head>
<meta http-equiv="Content-Type" content="text/html;
charset=iso-8859-1">
<title>textarea Problem</title>

</head>

<body>

<textarea cols=40 rows=3></textarea>

</body>

</html>
***** End of Code *****

I do not have an always fails with, always succeeds with, but the
following reliably fails on my system (IE 9 & Windows 7):

Start the page.
Click on the textarea control.
Type "The quick,<brown fox<jumps over<the lazy<dog.<" where "<"
means <Enter>.
Press <left-arrow>. The cursor moves to just after the period in
"dog.".
Press <left-arrow> four times. The cursor moves to the beginning
of the line "dog.".
Press <left-arrow> again. The cursor move to the end of the
"dog." line rather than the end of the "the lazy" line.

This works in Firefox 9.0.1 on Windows XP.

Sincerely,

Gene Wirchenko

Jukka K. Korpela · Dec 29, 2011

This will be part of an internal app. JavaScript will be
enabled.

You originally described the issue as a JavaScript problem, and now you
seem to confirm this. Yet, the example you give is pure HTML with no
scripting.

Yes, I do not trust, but I still want a good front-end for the
good users. I will validate as in belt and suspenders.

I have no argument about that. But you originally wrote about
elimination of "extraneous spaces and newlines", and I cannot see that
as validation.

Here is some basic
code that can replicate the problem.

I tested a verbatim copy of the code on IE 9.0.8112.16421 on Windows 7
Pro and did not see anything like the problem you describe as occurring
"reliably".

Gene Wirchenko · Dec 29, 2011

You originally described the issue as a JavaScript problem, and now you
seem to confirm this. Yet, the example you give is pure HTML with no
scripting.

I stated that I ran into it with JavaScript and then found it to
be so in straight HTML, too.

I have no argument about that. But you originally wrote about
elimination of "extraneous spaces and newlines", and I cannot see that
as validation.

Well, I do. Neatness counts.

Some validations can be forced. For example, a Canadian Postal
Code has uppercase alphabetics, and applying String's .toUpperCase()
to it is a way of ensuring validity. Extraneous spaces and newlines
can be wrong, too.

I tested a verbatim copy of the code on IE 9.0.8112.16421 on Windows 7
Pro and did not see anything like the problem you describe as occurring
"reliably".

Did you do exactly what I stated? I also stated that I did not
have the problem totally identified, but that I had a case that always
gave the problem. I have also had similar things not fail that way.

Sincerely,

Gene Wirchenko

textarea NewLine Value	8	Dec 29, 2011
carousel and IE9 problem	4	Apr 29, 2011
Setting style of textarea to not look editable and prevent resizing.	4	Jul 17, 2013
Which DTD Should I Use?	7	Dec 20, 2011
Check forms With JavaScript	1	Mar 28, 2023
CSS Missing Units	19	Dec 20, 2011
Not Having a Control in the taborder	9	Mar 8, 2012
Limit textarea length	5	Jan 26, 2005

IE9 textarea Problem

Gene Wirchenko

Adrienne Boswell

Gene Wirchenko

Jukka K. Korpela

Gene Wirchenko

Ask a Question

Similar Threads

Members online

Forum statistics

Latest Threads