473,289 Members | 1,848 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,289 software developers and data experts.

Unable to generate the Table

I was trying to display a small table on the click event of the button
but my browser just displayes plain text (I tried on Firefox and IE
both) here is the code :
<HTML>

<HEAD>
<TITLE>
Table Hover Test
</TITLE>

<SCRIPT>
function makeTable()
{
document.getElementById('insertCalTable').innerHTM L+='<TABLE
BORDER=5>'
for(var i=0;i<10;i++)
{
document.getElementById('insertCalTable').innerHTM L+='<TR>'
for(var j=0;j<10;j++)
document.getElementById('insertCalTable').innerHTM L+='<TD>Hi
There</TD>'
document.getElementById('insertCalTable').innerHTM L+='</TR>'
}
document.getElementById('insertCalTable').innerHTM L += '</TABLE>'
}
function htmlCode()
{
document.getElementById('insertHere').innerHTML
+=document.getElementById('insertCalTable').innerH TML
}
</SCRIPT>
</HEAD>

<BODY>
<Button onCLick="makeTable()">Create Table</Button>
<Button onCLick="htmlCode()">Create Table</Button>
<DIV ID="insertCalTable">
</DIV>

<Div id="insertHere">
</Div>

</BODY>

</HTML>

can anybody of you please suggest , where am I going wrong

Sep 24 '05 #1
5 2649
Prashant Mahajan wrote:
I was trying to display a small table on the click event of the button
but my browser just displayes plain text (I tried on Firefox and IE
both) here is the code :

When posting code, you need to make life as simple as possible for
others to help you. Do not use tabs, indent using 2 or 4 spaces.

Manually wrap lines of code at about 70 characters, allowing automatic
wrapping will introduce errors that make life more difficult.


<HTML>

<HEAD>
<TITLE>
Table Hover Test
</TITLE>

<SCRIPT>
The type attribute is required:

<script type="text/javascript">

function makeTable()
{
document.getElementById('insertCalTable').innerHTM L+='<TABLE
BORDER=5>'


Do not use innerHTML to create tables. You can get away with creating
the entire table in one go, but in general you should use the document
object model (DOM) for complex elements like tables or other nested
elements - Microsoft, who invented innerHTML offer the same advice:

<URL:http://msdn.microsoft.com/workshop/author/dhtml/reference/properties/innerhtml.asp>
To use innerHTML, concatenate your HTML into a single variable, then
write it in one go:

function makeTable()
{
var txt = '<TABLE BORDER=5>';
for (var i=0; i<10; i++){
txt += '<tr>'
for (var j=0; j<10; j++){
txt += '<td>Hi There</td>';
}
txt += '</tr>';
}
txt += '</table>'
document.getElementById('insertCalTable').innerHTM L = txt;
}
The equivalent using DOM would be:

function makeTable()
{
var oTable = document.createElement('table');
var oTBody = document.createElement('tbody');
for (var i=0; i<10; i++){
var oTR = document.createElement('tr');
for (var j=0; j<10; j++){
var oTD = document.createElement('td');
oTD.appendChild(document.createTextNode('Hi There'));
oTR.appendChild(oTD);
}
oTBody.appendChild(oTR);
}
oTable.appendChild(oTBody);
document.getElementById('insertCalTable').appendCh ild(oTable);
}

so the logic is pretty much what you tried with innerHTML but the
methods require a little more typing - and you are standards compliant.

[...]

--
Rob
Sep 24 '05 #2
Thanks a lot for your reply I will try what you said , and thanks for
making me aware of the current standereds

Sep 24 '05 #3
Your method worked , thanks a lot.

Sep 24 '05 #4
Do not use innerHTML to create tables. You can get away with creating
the entire table in one go, but in general you should use the document
object model (DOM) for complex elements like tables or other nested
elements - Microsoft, who invented innerHTML offer the same advice:

Ok I got you so far but I want to know "WHY" that method didn't
worked? You said yourself that the logic wasn't the problem so then why
the innerHTML property didn't worked the way it is supposed to do?

Sep 25 '05 #5
Prashant Mahajan wrote on 25 sep 2005 in comp.lang.javascript:
Do not use innerHTML to create tables. You can get away with creating
the entire table in one go, but in general you should use the document
object model (DOM) for complex elements like tables or other nested
elements - Microsoft, who invented innerHTML offer the same advice:

Ok I got you so far but I want to know "WHY" that method didn't
worked? You said yourself that the logic wasn't the problem so then why
the innerHTML property didn't worked the way it is supposed to do?


Because innerHTML inserting a incomplete table invokes the browser to add
the missing parts of the table. Retrieving that changed tablecode and
adding to that by

x.innerHTML += ...

will make havoc of the resulting table code.

See the thread:
<http://groups.google.com/group/comp.lang.javascript/msg/c537d4c1faf55ebd>
4 days ago.

Searching the archive before asking the same question as was asked recently
is common Netiquette, btw.

--
Evertjan.
The Netherlands.
(Replace all crosses with dots in my emailaddress)

Sep 25 '05 #6

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

Similar topics

1
by: jtsree | last post by:
i am using Visual Studio.net professional 2003 (VisualBasic.net).I am building a very very simple project where i need to connect to Microsoft access database through OledbDataAdapter in design...
1
by: jtsree | last post by:
I am Using (Windows XP) Visual Studio.net 2003 professional edition working on VB.net language. I am bulding a very very simple project in VB.net where i connect to Access Database by dragging...
4
by: Chris Bower | last post by:
Reposted from aspnet.buildingcontrols: Ok, I've got a bunch of derived controls that all have a property Rights of type Rights (Rights is an Enumerator). I wrote a custom TypeConverter so that I...
1
by: A Traveler | last post by:
Hello, i am having this problem. The exact error message is: "Unable to generate code for a value of type 'System.Web.UI.Page'. This error occurred while trying to generate the property value for...
10
by: Grumpy Aero Guy | last post by:
Visual Studio .net Academic Edition: After creating a OLEdbDataadapter, followed by an OLE DB Connection (all of which occurs successfully, by the way), I am unable to create a Dataset. I...
0
by: kent.anderson | last post by:
I am getting the following error when attempting to generate C# proxy code with the wsdl.exe tool: Error: Unable to import binding 'XtractSoapBinding' from namespace 'http://xtrac...
2
by: UJ | last post by:
I've got a web service that is giving me back this error message. The directory is Windows\Temp and I have given everybody complete access to this directory and am still getting the error. Any...
0
by: Matt MacDonald | last post by:
Hi All, When using the dataset designer, at least once a week or so, I will try to add a new query to a table adapter, or modify an existing one and get the error "Unable to find connection...
0
by: okonita | last post by:
DB2v8.2 LUW. Unable to drop Foreign Key constraints...although DROP constraints returns undefined name. Am I missing somrthing here? Hi all, I have a perplexing DB2 Drop command situation....
0
by: MeoLessi9 | last post by:
I have VirtualBox installed on Windows 11 and now I would like to install Kali on a virtual machine. However, on the official website, I see two options: "Installer images" and "Virtual machines"....
0
by: DolphinDB | last post by:
The formulas of 101 quantitative trading alphas used by WorldQuant were presented in the paper 101 Formulaic Alphas. However, some formulas are complex, leading to challenges in calculation. Take...
0
by: DolphinDB | last post by:
Tired of spending countless mintues downsampling your data? Look no further! In this article, you’ll learn how to efficiently downsample 6.48 billion high-frequency records to 61 million...
0
by: Aftab Ahmad | last post by:
Hello Experts! I have written a code in MS Access for a cmd called "WhatsApp Message" to open WhatsApp using that very code but the problem is that it gives a popup message everytime I clicked on...
0
by: ryjfgjl | last post by:
ExcelToDatabase: batch import excel into database automatically...
0
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 6 Mar 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, we are pleased to welcome back...
0
by: marcoviolo | last post by:
Dear all, I would like to implement on my worksheet an vlookup dynamic , that consider a change of pivot excel via win32com, from an external excel (without open it) and save the new file into a...
0
by: Vimpel783 | last post by:
Hello! Guys, I found this code on the Internet, but I need to modify it a little. It works well, the problem is this: Data is sent from only one cell, in this case B5, but it is necessary that data...
0
by: ArrayDB | last post by:
The error message I've encountered is; ERROR:root:Error generating model response: exception: access violation writing 0x0000000000005140, which seems to be indicative of an access violation...

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.