Welcome to WebmasterWorld Guest from 54.145.208.64

Forum Moderators: open

Message Too Old, No Replies

Opera javascript annoyance

   
4:25 pm on Feb 6, 2003 (gmt 0)

10+ Year Member



Just to inform you ...

I wanted to display the contents of a textarea in a new window. I noticed that when the display css property of the textarea was set to display: none, the textarea.value returned nothing (alert says "Warning").
In all other cases, I get the content ...

Is this an expected behavior, or are IE and MOZILLA wrong?

Can't believe that setting css-properties affects the javascript ...

Code below illustrates the problem ...

<EDIT> It is with Opera 7.0 </EDIT>

<html>
<head>
<title></title>
</head>
<body style="height: 100%; margin: 0px; padding: 0px;">
<textarea style="display: none;" rows="0" cols="0" id="__A" name="__A">Test</textarea>

<input type="button" value="test" onclick="alert(document.getElementById('__A').value);"></input>
</body>
</html>

[edited by: Yoeri at 5:38 pm (utc) on Feb. 6, 2003]

4:39 pm on Feb 6, 2003 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Is that with opera 6.05 and earlier or the new 7.0?

Before version 7, Opera did not allow changes to the html layout after it is initially rendered
(opera 7 works like a dream however) so display:none can be problematic.

5:39 pm on Feb 6, 2003 (gmt 0)

10+ Year Member



Opera 7

Edited my post ...

5:56 pm on Feb 6, 2003 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



how about using visibility:hidden instead of display:none, which will actually render the element but not display it
6:19 pm on Feb 6, 2003 (gmt 0)

WebmasterWorld Senior Member drdoc is a WebmasterWorld Top Contributor of All Time 10+ Year Member



Great suggestion amznVibe!

Yoeri, usually (99% of the time) Opera is right, and everyone else is wrong. There are exceptions, but usually there's a workaround ..

If something doesn't work in Opera it's usually wise to try a different solution, but with the same (or better) result .. just as amznVibe suggested :)

7:21 am on Feb 7, 2003 (gmt 0)

10+ Year Member



I want to become the effect of display: none, not visibility: hidden ... thenks for the suggestion
6:43 pm on Feb 7, 2003 (gmt 0)

WebmasterWorld Senior Member drdoc is a WebmasterWorld Top Contributor of All Time 10+ Year Member



Just add absolute position and place it in the top left corner and you won't get an empty box where the textarea normally would've appeared.
6:00 am on Feb 11, 2003 (gmt 0)

10+ Year Member



The same thing will probably happen with Mozilla (NN6-7), as well.
Elements with the display: none property are treated as UNAVAILABLE. As if they didn't exist.

Not so with visibility: hidden.

I don't know what the html spec says is supposed to happen, it's probably a grey area. IE keeps it available.

So use visibility and DrDoc's positioning suggestion will take the textarea element out of the flow of the document.
As good as display: none.

4:35 pm on Feb 11, 2003 (gmt 0)

10+ Year Member



Thanks for the suggestions ...

Mozilla 1.x does it, even when display is set to none ...

gph

12:50 am on Feb 12, 2003 (gmt 0)

10+ Year Member



Odd

<html>
<head>
<title></title>
</head>
<body style="height: 100%; margin: 0px; padding: 0px;">
<textarea style="display: none;" rows="0" cols="0" id="__A" name="__A">Test</textarea>

<input type="button" value="test" onclick="alert(document.getElementById('__A').innerText);"></input>
</body>
</html>

3:14 am on Feb 14, 2003 (gmt 0)

10+ Year Member



innerText will work in this context in IE and Opera.
But not Mozilla/NN.

However, innerHTML works in all three!

I really, really like Opera 7. first version worthy of serious consideration from a developer's standpoint.
But I find their javascript implementation very quirky.
I hope they get it more in line with Moz and IE before anybody starts using Opera in numbers that make any kind of a difference!

(Also, input doesn't get a closing tag. No "</input>".)

gph

11:11 pm on Feb 14, 2003 (gmt 0)

10+ Year Member



I was thinking of a different approach. Only feeding Opera 7(+?) a work around and keeping value as it's supposed to be with other browsers. When Opera comes online with the issue you won't have convoluted code to change, you'll just have to drop the barrier. I tried innerHTML first but figured innerText made for better readability, we’re not looking for HTML.

Now I'm thinking this is better

<html>
<head>
<title></title>
</head>
<body>
<input type="hidden" id="__A" value="test">
<input type="button" value="test" onclick="alert(document.getElementById('__A').value);">
</body>
</html>

As to the closing input tag, I tried both innerHTML and innerText right beside it and didn't even notice :) Good eye.

3:40 am on Feb 28, 2003 (gmt 0)

10+ Year Member



This thread started with a case of the browser ignoring the value of a text box that had a style of display: none.

Display none does funny things. Today I had occasion to check the behavior of iframes - both with display: none and visibility: hidden. The web server logs showed that on page load, the iframes with style display: none did not load!
However with visibility: hidden, the browser did request the pages specified in the src attribute.