473,763 Members | 9,275 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

DOM alteration rendering

The following Addel function renders a new line on Mozilla but nothing
on IE 6 , yet no error is parsed neither on IE nor Mozilla. Any
explanation ? Thanks a lot.

<html>
<head>
<title>Mozill a Rich Text Editing Demo</title>
<link rel=stylesheet href="./css/Flux.css" type="text/css" />

<script language="JavaS cript" type="text/javascript">
function Addel(){
var newtr = document.create Element("tr");
var newtd = document.create Element("td");
var oTextNode = document.create TextNode("Test if text");
document.getEle mentById("table paratest").appe ndChild(newtr);
newtr.appendChi ld(newtd);
newtd.setAttrib ute("class", "imagebutto n");
newtd.setAttrib ute("height", "100px");
newtd.appendChi ld(oTextNode);

/*
var newli = document.create Element("LI");
document.body.a ppendChild(newl i);
newli.appendChi ld(oTextNode);
*/
if(navigator.ap pName == "Microsoft Internet Explorer"){
document.getEle mentById("table paratest").refr esh();
document.recalc (true);
}
}
</script>
</head>
<body onLoad="Addel() " >
<table id="tableparate st" cellpadding="0" cellspacing="0" >
<tr>
<td>
<iframe id="edit" name="testnamei e" width="600px"
allowTransparen cy="true" scrolling="no" style="border-width:0px;
margin:0px" class="normal" frameborder="0" ></iframe>
</td>
</tr>
<tr>
<td height="50px" class="imagebut ton">static test</td>
</tr>
</table>
</body>
</html>
Jul 23 '05 #1
5 2055
alexandre damiron wrote:
The following Addel function renders a new line on Mozilla but nothing
on IE 6 , yet no error is parsed neither on IE nor Mozilla. Any
explanation ? Thanks a lot.

<html>
<head>
<title>Mozill a Rich Text Editing Demo</title>
<link rel=stylesheet href="./css/Flux.css" type="text/css" />

<script language="JavaS cript" type="text/javascript">
function Addel(){
var newtr = document.create Element("tr");
var newtd = document.create Element("td");
var oTextNode = document.create TextNode("Test if text");
document.getEle mentById("table paratest").appe ndChild(newtr);
newtr.appendChi ld(newtd);
newtd.setAttrib ute("class", "imagebutto n");
newtd.setAttrib ute("height", "100px");
newtd.appendChi ld(oTextNode);

I would approach this differently:
newtd.className ="imagebutto n"
Forget about "height", no such attribute for a <td>

/*
var newli = document.create Element("LI");
document.body.a ppendChild(newl i);
newli.appendChi ld(oTextNode);
*/
if(navigator.ap pName == "Microsoft Internet Explorer"){
document.getEle mentById("table paratest").refr esh();
I don't think the table element has a "refresh()" method
document.recalc (true);
What is "recalc()" ?
}
}
</script>
</head>
<body onLoad="Addel() " >
<table id="tableparate st" cellpadding="0" cellspacing="0" >
<tr>
<td>
<iframe id="edit" name="testnamei e"
width="600px" allowTransparen cy="true" scrolling="no"
style="border-width:0px; margin:0px" class="normal"
frameborder="0" ></iframe>


Where's the <iframe> "src", and what is "allowTranspare ncy"?
[snip]

Mick
Jul 23 '05 #2
"alexandre damiron" <wp*****@yahoo. com> wrote in message
news:42******** *************** @news.free.fr.. .
The following Addel function renders a new line on Mozilla but nothing
on IE 6 , yet no error is parsed neither on IE nor Mozilla. Any
explanation ? Thanks a lot.

<html>
<head>
<title>Mozill a Rich Text Editing Demo</title>
<link rel=stylesheet href="./css/Flux.css" type="text/css" />

<script language="JavaS cript" type="text/javascript">
function Addel(){
var newtr = document.create Element("tr");
var newtd = document.create Element("td");
var oTextNode = document.create TextNode("Test if text");
document.getEle mentById("table paratest").appe ndChild(newtr);
newtr.appendChi ld(newtd);
newtd.setAttrib ute("class", "imagebutto n");
newtd.setAttrib ute("height", "100px");
newtd.appendChi ld(oTextNode);

/*
var newli = document.create Element("LI");
document.body.a ppendChild(newl i);
newli.appendChi ld(oTextNode);
*/
if(navigator.ap pName == "Microsoft Internet Explorer"){
document.getEle mentById("table paratest").refr esh();
document.recalc (true);
}
}
</script>
</head>
<body onLoad="Addel() " >
<table id="tableparate st" cellpadding="0" cellspacing="0" >
<tr>
<td>
<iframe id="edit" name="testnamei e" width="600px"
allowTransparen cy="true" scrolling="no" style="border-width:0px;
margin:0px" class="normal" frameborder="0" ></iframe>
</td>
</tr>
<tr>
<td height="50px" class="imagebut ton">static test</td>
</tr>
</table>
</body>
</html>


Whether or not it shows in your HTML code, the browser creates a <tbody>
element to contain the rows. You can not append a <tr> directly to a
<table>, you must append it to the <tbody>. The easiest thing to do is
simply include the <tbody> element in your HTML, then append to that:

<table ...>
<tbody id="myTbody">

and your code:

document.getEle mentById('myTbo dy').appendChil d(newTr);

If you don't include the <tbody> in your HTML, then you must rely on
code to find it:

var myTable = document.getEle mentById('myTab le');
if (myTable)
{
var myTbody;
for (var ii = 0; ii < myTable.childNo des.length; ++ii)
{
if ('tbody' == myTable.childNo des[ii].nodeName.toLow erCase())
{
myTbody = myTable.childNo des[ii];
break;
}
}
if (myTbody)
{
// ...
}
}

--
Grant Wagner <gw*****@agrico reunited.com>
comp.lang.javas cript FAQ - http://jibbering.com/faq
Jul 23 '05 #3
Thank you Mick
- working on "className" attribute is a better practice, you are right.
- yes, let's forget about the height. I'll take care of that. But I
should be able to read "Test if text". I think my line isn't in fact
displayed at all on IE while it is in Mozilla.
- Sorry for the Iframe. It is just a part of another dynamic loading
feature which has nothing to do with the current problem.
- Yes, recalc() and refresh() are microsoft-only functions created by
them to "patch" rendering difficulties on IE. It did not work in my case.
- The disabled 3 lines worked on IE when enabled, and output a point
line. It worked on Mozilla too, but in this case Mozilla does not output
the new line anymore, cause oTextNode is unique and can be assigned one
time only. This is normal. But what is that IE problem with newtr ? Does
IE limit output to one generation (no subchildren) ?

Mick White a écrit :
alexandre damiron wrote:
The following Addel function renders a new line on Mozilla but nothing
on IE 6 , yet no error is parsed neither on IE nor Mozilla. Any
explanation ? Thanks a lot.

<html>
<head>
<title>Mozill a Rich Text Editing Demo</title>
<link rel=stylesheet href="./css/Flux.css" type="text/css" />
<script language="JavaS cript" type="text/javascript">
function Addel(){
var newtr = document.create Element("tr");
var newtd = document.create Element("td");
var oTextNode = document.create TextNode("Test if text");
document.getEle mentById("table paratest").appe ndChild(newtr);
newtr.appendChi ld(newtd);
newtd.setAttrib ute("class", "imagebutto n");
newtd.setAttrib ute("height", "100px");
newtd.appendChi ld(oTextNode);


I would approach this differently:
newtd.className ="imagebutto n"
Forget about "height", no such attribute for a <td>

/*
var newli = document.create Element("LI");
document.body.a ppendChild(newl i);
newli.appendChi ld(oTextNode);
*/
if(navigator.ap pName == "Microsoft Internet Explorer"){
document.getEle mentById("table paratest").refr esh();

I don't think the table element has a "refresh()" method
document.recalc (true);

What is "recalc()" ?
}
}
</script>
</head>
<body onLoad="Addel() " >
<table id="tableparate st" cellpadding="0" cellspacing="0" >
<tr>
<td>
<iframe id="edit" name="testnamei e"
width="600px" allowTransparen cy="true" scrolling="no"
style="border-width:0px; margin:0px" class="normal"
frameborder="0" ></iframe>

Where's the <iframe> "src", and what is "allowTranspare ncy"?
[snip]

Mick

Jul 23 '05 #4
That was the problem. Thank you Grant.

Grant Wagner a écrit :
"alexandre damiron" <wp*****@yahoo. com> wrote in message
news:42******** *************** @news.free.fr.. .
The following Addel function renders a new line on Mozilla but nothing
on IE 6 , yet no error is parsed neither on IE nor Mozilla. Any
explanation ? Thanks a lot.

<html>
<head>
<title>Mozill a Rich Text Editing Demo</title>
<link rel=stylesheet href="./css/Flux.css" type="text/css" />

<script language="JavaS cript" type="text/javascript">
function Addel(){
var newtr = document.create Element("tr");
var newtd = document.create Element("td");
var oTextNode = document.create TextNode("Test if text");
document.getE lementById("tab leparatest").ap pendChild(newtr );
newtr.appendC hild(newtd);
newtd.setAttr ibute("class", "imagebutto n");
newtd.setAttr ibute("height", "100px");
newtd.appendC hild(oTextNode) ;

/*
var newli = document.create Element("LI");
document.body .appendChild(ne wli);
newli.appendC hild(oTextNode) ;
*/
if(navigator. appName == "Microsoft Internet Explorer"){
document.getE lementById("tab leparatest").re fresh();
document.reca lc(true);
}
}
</script>
</head>
<body onLoad="Addel() " >
<table id="tableparate st" cellpadding="0" cellspacing="0" >
<tr>
<td>
<iframe id="edit" name="testnamei e" width="600px"
allowTranspar ency="true" scrolling="no" style="border-width:0px;
margin:0px" class="normal" frameborder="0" ></iframe>
</td>
</tr>
<tr>
<td height="50px" class="imagebut ton">static test</td>
</tr>
</table>
</body>
</html>

Whether or not it shows in your HTML code, the browser creates a <tbody>
element to contain the rows. You can not append a <tr> directly to a
<table>, you must append it to the <tbody>. The easiest thing to do is
simply include the <tbody> element in your HTML, then append to that:

<table ...>
<tbody id="myTbody">

and your code:

document.getEle mentById('myTbo dy').appendChil d(newTr);

If you don't include the <tbody> in your HTML, then you must rely on
code to find it:

var myTable = document.getEle mentById('myTab le');
if (myTable)
{
var myTbody;
for (var ii = 0; ii < myTable.childNo des.length; ++ii)
{
if ('tbody' == myTable.childNo des[ii].nodeName.toLow erCase())
{
myTbody = myTable.childNo des[ii];
break;
}
}
if (myTbody)
{
// ...
}
}

Jul 23 '05 #5
alexandre damiron wrote:
Thank you Mick

[...]
alexandre damiron wrote: [...]
newtd.setAttrib ute("class", "imagebutto n");
newtd.setAttrib ute("height", "100px");


Might also be worth considering using the style object rather
than setAttribute:

newtd.style.cla ssName = 'imagebutton';

[...]

--
Fred
Jul 23 '05 #6

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

6
3024
by: David Opstad | last post by:
I have a question about text rendering I'm hoping someone here can answer. Is there a way of doing linguistically correct rendering of Unicode strings in Python? In simple cases like Latin or Japanese I can just print the string and see the correct results. However, I don't know how to get Python to do the right thing for writing systems which require contextual processing. For example, let's say I create this Unicode string in Arabic: ...
3
1773
by: Beetlegeuse | last post by:
Here is a screenshot of three different versions of rendering of the trouble area: http://img371.imageshack.us/img371/2572/layout8xg.gif (ignore the language of the text) The first rendering is the weirdest one -- the background and border of the items (placed within span tags) are
3
3040
by: David Whitney | last post by:
All: I have a control that renders a table. As the table is rendered, each row in the table is constructed by creating a run-time (dynamic) object that is derived from an HtmlTableRow. The row has three HtmlTableCell objects, and each cell contains a single control added to the HtmlTableCell's Controls collection. The basic table renders correctly, but the controls within the HtmlTableCell objects do not; the cells are just empty. (Just...
5
2641
by: Dave A | last post by:
I am writing an ASP.NET tool that will allow the client to create their own online froms. ie the client can add tect boxes, text, drop downs,etc with absolutely no technical skill what so ever. The form can then be deployed to their intranet. The form designer is somewhat WYSIWYG but it contains a heap of 'edit', 'delete' and reordering buttons that are not seen when the form is acutally being used. I would love to have a preview...
4
4125
by: tobfon | last post by:
I'm creating a scientific visualization application with rather high demands on performance. I've created a nice rendering engine for it in C++/OpenGL and a python interface to the rendering engine. Now I'm looking to build a GUI in python with the rendering engine as an integrated window. I will most likely use wxPython for the GUI and I know it has support for adding an OpenGL canvas. After looking around in these groups and others it...
3
10107
by: ramesh | last post by:
Hi all, I am facing a problem with the rendering of html into a windows application (C# .NET). I am trying with two possible approaches: 1. Use a control that directly renders the html into windows form, but it should not be dependent on IE or mshtml. I didn't get such kind of control so far. Can any one help on this? 2. Use a third party Html to Rtf converter and render the rtf in
0
1428
by: Juan R. | last post by:
Since the idea of encoding mathematics using MathML is being very far from popular due to a number of factors -expensive tools, bad accesibility of generated code, unusual verbosity, lack of adequate support, special fonts, namespaces, special plugins, backward incompatiblity of MathML with other internet technologies, duplication of code, and others-, alternative encodings are spreading over the internet. Probably the most popular one...
5
2343
by: paul.hester | last post by:
Hi all, I have a custom control with an overridden Render method. Inside this method I'm rendering each control in its collection using their RenderControl method. However, I'm running into a problem in this scenario: <myprefix:mycontrol runat="server"> <%= SomeVariable %> </myprefix:mycontrol>
12
2881
by: Boris Borcic | last post by:
Hello, I am trying to use UI Automation to drive an MS Windows app (with pywinauto). I need to scrape the app's window contents and use some form of OCR to get at the texts (pywinauto can't get at them). As an alternative to integrating an OCR engine, and since I know the fonts and sizes used to write on the app's windows, I reasoned that I could base a simple text recognition module on the capability to drive MSWindows text...
0
9387
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can effortlessly switch the default language on Windows 10 without reinstalling. I'll walk you through it. First, let's disable language synchronization. With a Microsoft account, language settings sync across devices. To prevent any complications,...
0
10148
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers, it seems that the internal comparison operator "<=>" tries to promote arguments from unsigned to signed. This is as boiled down as I can make it. Here is my compilation command: g++-12 -std=c++20 -Wnarrowing bit_field.cpp Here is the code in...
0
10002
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven tapestry of website design and digital marketing. It's not merely about having a website; it's about crafting an immersive digital experience that captivates audiences and drives business growth. The Art of Business Website Design Your website is...
1
9938
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows Update option using the Control Panel or Settings app; it automatically checks for updates and installs any it finds, whether you like it or not. For most users, this new feature is actually very convenient. If you want to control the update process,...
0
9823
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each protocol has its own unique characteristics and advantages, but as a user who is planning to build a smart home system, I am a bit confused by the choice of these technologies. I'm particularly interested in Zigbee because I've heard it does some...
0
8822
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing, and deployment—without human intervention. Imagine an AI that can take a project description, break it down, write the code, debug it, and then launch it, all on its own.... Now, this would greatly impact the work of software developers. The idea...
1
7368
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new presenter, Adolph Dupré who will be discussing some powerful techniques for using class modules. He will explain when you may want to use classes instead of User Defined Types (UDT). For example, to manage the data in unbound forms. Adolph will...
2
3528
muto222
by: muto222 | last post by:
How can i add a mobile payment intergratation into php mysql website.
3
2794
bsmnconsultancy
by: bsmnconsultancy | last post by:
In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence can significantly impact your brand's success. BSMN Consultancy, a leader in Website Development in Toronto offers valuable insights into creating effective websites that not only look great but also perform exceptionally well. In this comprehensive...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.