Connecting Tech Pros Worldwide Help | Site Map

Strange behavior in IE6 with the DOM

Frederik Sørensen
Guest
 
Posts: n/a
#1: Jul 23 '05
I have a script that shows an absolute positioned div where a user can
select the time in a calendar.

The script works perfect in Firefox but in IE6 only my test text node
shows up, not any of the tables.

The page http://demo.patch.dk/test.php show a working example click the
button to show the div.
The script http://demo.patch.dk/plugin/Js/time.js

Any idea what could cause this?

/Frederik Sørensen
RobG
Guest
 
Posts: n/a
#2: Jul 23 '05

re: Strange behavior in IE6 with the DOM


Frederik Sørensen wrote:[color=blue]
> I have a script that shows an absolute positioned div where a user can
> select the time in a calendar.
>
> The script works perfect in Firefox but in IE6 only my test text node
> shows up, not any of the tables.
>
> The page http://demo.patch.dk/test.php show a working example click the
> button to show the div.
> The script http://demo.patch.dk/plugin/Js/time.js
>
> Any idea what could cause this?
>
> /Frederik Sørensen[/color]

I didn't wade through all your code, but it seems you may be adding
your 'tr' elements to the table, not the tbody.

tbody elements are mandatory, but since they are nearly never created
in the HTML, browsers insert them where appropriate. When adding
rows to a table element, Geko browsers assume you meant to add them
to the tbody and so they do that. IE just does nothing.

The solution is to add rows to the tbody, either code a tbody in your
HTML and give it an id so you can find it explicitly, or go down the
DOM from your table element to the tbody and go from there.


--
Rob
RobG
Guest
 
Posts: n/a
#3: Jul 23 '05

re: Strange behavior in IE6 with the DOM


RobG wrote:[color=blue]
> Frederik Sørensen wrote:
>[color=green]
>> I have a script that shows an absolute positioned div where a user can
>> select the time in a calendar.
>>
>> The script works perfect in Firefox but in IE6 only my test text node
>> shows up, not any of the tables.
>>
>> The page http://demo.patch.dk/test.php show a working example click
>> the button to show the div.
>> The script http://demo.patch.dk/plugin/Js/time.js
>>
>> Any idea what could cause this?
>>
>> /Frederik Sørensen[/color]
>
>
> I didn't wade through all your code, but it seems you may be adding
> your 'tr' elements to the table, not the tbody.
>
> tbody elements are mandatory, but since they are nearly never created
> in the HTML, browsers insert them where appropriate. When adding
> rows to a table element, Geko browsers assume you meant to add them
> to the tbody and so they do that. IE just does nothing.
>
> The solution is to add rows to the tbody, either code a tbody in your
> HTML and give it an id so you can find it explicitly, or go down the
> DOM from your table element to the tbody and go from there.
>
>[/color]

Ah, just found it:

var tableHour = document.createElement('table');
...
var tableHourRow = document.createElement('tr');
...
tableHour.appendChild(tableHourRow);

Create a tbody, append it to the table element then append your rows
to the tbody.



--
Rob
Frederik Sørensen
Guest
 
Posts: n/a
#4: Jul 23 '05

re: Strange behavior in IE6 with the DOM


RobG wrote:[color=blue]
> Create a tbody, append it to the table element then append your rows
> to the tbody.
>[/color]

That fixed it but i ran into another problem.

All my tmp.setAttribute('style', 'background:blue;'); calls is totaly
ignored by IE6
same with all my tmpLink.setAttribute('onmouseover',
'g_Time.highliteText(\'min'+i+'\')');

But the tmp.setAttribute('id', 'hour'+i); works fine.

I could set the style by using tmp.style.backgroundColor = 'blue'; aso.
which seems to work fine i both IE and firefox.

But how can i fix the onmouseover/onmouseout problem?

tmpLink.onmouseout = 'g_Time.highliteText(\'min'+i+'\')'; is not working

/Frederik Sørensen
Michael Winter
Guest
 
Posts: n/a
#5: Jul 23 '05

re: Strange behavior in IE6 with the DOM


Frederik Sørensen wrote:

[problems with setAttribute()]
[color=blue]
> But the tmp.setAttribute('id', 'hour'+i); works fine.[/color]

For HTML documents, I always consider the use of the property
equivalents to be preferable. For instance,

tmp.id = 'hour' + i;
[color=blue]
> I could set the style by using tmp.style.backgroundColor = 'blue'; [...][/color]

Either that or

tmp.style.setProperty('background-color', 'blue', '');

I tend to use the former.
[color=blue]
> But how can i fix the onmouseover/onmouseout problem?
>
> tmpLink.onmouseout = 'g_Time.highliteText(\'min'+i+'\')'; is not working[/color]

The event properties expect function objects, not strings. The solution
in this case should be:

tmpLink.onmouseout
= new Function("g_Time.highliteText('min" + i + "');");



Instead of writing

Time<identifier> = function(/* ... */) {
/* ... */
};
TimeSelecter.prototype.<identifier> = Time<identifier>;

why not just write:

TimeSelecter.prototype.<identifier> = function(/* ... */) {
/* ... */
};

As far as I can see, none of these interim functions are used directly,
so why clutter the global object with identifiers that aren't necessary?

A point of very little concern: selecter isn't a word in the English
language (as far as I know). Selector is. :)

Mike

--
Michael Winter
Replace ".invalid" with ".uk" to reply by e-mail.
Dr John Stockton
Guest
 
Posts: n/a
#6: Jul 23 '05

re: Strange behavior in IE6 with the DOM


JRS: In article <LZLbe.20589$G8.19117@text.news.blueyonder.co.uk >,
dated Wed, 27 Apr 2005 12:56:11, seen in news:comp.lang.javascript,
Michael Winter <m.winter@blueyonder.co.invalid> posted :[color=blue]
>
>A point of very little concern: selecter isn't a word in the English
>language (as far as I know). Selector is. :)[/color]

True : but it may be in the Danish language.

But I find that there's advantage in using unconventional spellings in
code; they are less likely to clash with forgotten extant identifiers,
and one can scan pages for them without being troubled by the word being
rightly used in text.

--
© John Stockton, Surrey, UK. ?@merlyn.demon.co.uk DOS 3.3, 6.20; Win98. ©
Web <URL:http://www.merlyn.demon.co.uk/> - FAQqish topics, acronyms & links.
PAS EXE TXT ZIP via <URL:http://www.merlyn.demon.co.uk/programs/00index.htm>
My DOS <URL:http://www.merlyn.demon.co.uk/batfiles.htm> - also batprogs.htm.
Michael Winter
Guest
 
Posts: n/a
#7: Jul 23 '05

re: Strange behavior in IE6 with the DOM


On 28/04/2005 17:01, Dr John Stockton wrote:
[color=blue]
> JRS: In article <LZLbe.20589$G8.19117@text.news.blueyonder.co.uk >,
> dated Wed, 27 Apr 2005 12:56:11, seen in news:comp.lang.javascript,
> Michael Winter <m.winter@blueyonder.co.invalid> posted :
>[color=green]
>> A point of very little concern: selecter isn't a word in the English
>> language (as far as I know). [...][/color]
>
> True : but it may be in the Danish language.[/color]

For the record, I had considered that, but I don't think it's likely.
[color=blue]
> But I find that there's advantage in using unconventional spellings in
> code; they are less likely to clash with forgotten extant identifiers [...][/color]

Though one should weigh that against resulting spelling mistakes.
Conventional has it's own benefits, too.

Mike

--
Michael Winter
Replace ".invalid" with ".uk" to reply by e-mail.
Closed Thread


Similar JavaScript / Ajax / DHTML bytes