Using CreateElement To Insert A New Row Into A Table
Jul 28, 2004
<table id="test" style="width:200px;border: thin solid blue;">
<tr>
<td>
Test row 1
</td>
</tr>
</table>
I have a table like above and want to use document.createElement to insert a new row at the end of the table before the close table tag, is this possible?
My efforts so far have resulted in the following html:
<table id="test" style="width:200px;border: thin solid blue;">
<tr>
<td>
Test row 1
</td>
</tr>
</TBODY>
<TR>
<TD>Test row 2</TD>
</TR>
Which doesn't display properly as table has already been closed
This is the code I've knocked up for the test so far:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>Untitled</title>
</head>
<script>
function test(tableObj)
{
alert(tableObj.innerHTML);
//var newTable = document.createElement("table");
var newRow = document.createElement("tr");
var newCol = document.createElement("td");
newCol.innerText = "Test row 2";
newRow.insertBefore(newCol);
tableObj.appendChild(newRow)
alert(tableObj.innerHTML);
}
</script>
<body onload="test(document.all.test)">
<table id="test" style="width:200px;border: thin solid blue;">
<tr>
<td>
Test row 1
</td>
</tr>
</table>
</body>
</html>
View 7 Replies
ADVERTISEMENT
Apr 19, 2005
I've come up with this code and cant figure out why nothing appears when I press the buttonThe table is soposed to show. Probably something really simple cuz I often stuck on stupid things.
[HTML]<html>
<head>
<script type="text/javascript">
[code]....
View 6 Replies
View Related
Feb 26, 2010
I have two columns in my table and the rows are created dynamically.
<table
For each row, I want to get the value of each table and insert them in an object as follows.
How can I do that?
View 1 Replies
View Related
May 4, 2010
I have to implement simple LIFO algorithm ( if i can call it like this .. ) say i have html table and and i fetching data i like thet the last data that fetched to be the first record in the table
For example : im fetching the string "111" so it will be the first record next im fetching the string "222" now the string "111" will be the second and the string "222" will be the first .. and so on
View 2 Replies
View Related
Jun 23, 2006
I found that, insertRow, insertCell, is a bug of Mac IE,
Moreover, <table>, <tbody> seems doesn't support innerHTML,
What is the solution to show dynamic table in Mac IE?
View 3 Replies
View Related
Jul 12, 2011
I want to add dynamic rows in a table where I type in the name field and agrip on a button and then it adds in a table,but I was wondering how do I delete each line individually and also how to get the data in this table for PHP.[code]...
View 10 Replies
View Related
Mar 2, 2011
<div id="tabela">
<table border="0">
<tbody><tr><td class="blabla">TVOJE IGRE</td></tr>
[code]....
View 2 Replies
View Related
Aug 30, 2006
I'm STILL building tables on the fly. I want every other row to remain hidden as it'll contain data for further processing relating to the row above it. I do not want this info displayed.
So I can insert a row using the code below but how do I indicate that I want this row to be hidden ??????
function addRow(tableID)
{
var tableRef = document.getElementById(tableID);
// Insert a row in the table at row index 0
var newRow = tableRef.insertRow(0);
// Insert a cell in the row at index 0
var newCell = newRow.insertCell(0);
newCell.id = 'date'
newCell.name = 'date;
newCell.innerHTML = ཆ/10/16'
newRow.appendChild(newCell);
// Call addRow() with the ID of a table
addRow('TableA');
View 2 Replies
View Related
Oct 30, 2005
The following code (HTML) generates a table. Now I'd like to insert a new
row by a javascript.
The following code (javascript) works with the Internet Explorer and also
with Mozilla. However, the inserted button (onClick) in the table does not
work with the Internet Explorer. It only works with Mozilla. Code:
View 6 Replies
View Related
May 26, 2010
I would like to know what is wrong here that table rows/cols are not being inserted when using IE8, in FF and Chrome it works fine:What am I doing wrong?
var listFriends = eval(data.list);
var col = 0;
var ie8 = browser.isIE8;
[code]....
View 1 Replies
View Related
May 15, 2010
I know that JQuery is a very powerful library and was just wondering if it had the following capability that I really need.
Lets say I need to insert new cells into a table row, I know how to do this basic task, but I need to insert my cells in a highly unusual way due to some of the requirements that are needed for the new cells.
I need to be able to insert cells a certain distance into the row, For example, if a row was 1000pixels wide, is there a feature in JQuery that would allow me to insert the cell 250pixels into the row and have a cell width of 50pixels and insert another cell 500pixels into the row with a cell width of 100pixels. I know how to set a cells width using JQuery, just not distance into a row.
The values wont ever be the exact same as above though because they are actually read from a database, so for example, one cell would have the following values [code]...
View 1 Replies
View Related
Jul 31, 2009
i want to add an img to a specific cell in a table(which is inside a form) with inside a javascript function.
(i greened which function i use, which cell i want, and which img i want) this is the code i write so far:
<html>
<head>
<title>Black Jack</title>
<link rel="stylesheet" type="text/css">
<Script Language="JavaScript">
var h;
[Code]....
View 5 Replies
View Related
Apr 30, 2011
i want to know is there any code which will print a data into the bottom of a exist table? let say now i have a table like below
[Code]...
without overwrite all the old data...
View 9 Replies
View Related
Sep 1, 2009
The Script below generates a sudoku (9 by 9) table and displays the table on screen.
what I am trying to do is to get a string of numbers entered into the text field labeled "enter values" on the page below the table, into each cell box of the sudoku table when the button labelled "load" is pressed. This would fill the sudoku table with characters, one character (from the text field) to each of cell boxes in the sudoku table.
It requires using a for loop, I tried using one in my function (g) but it doesn't work,..
<html>
<head>
<title>Sudoku</title>
<style type="text/css">
[Code]....
View 1 Replies
View Related
Jun 7, 2011
I have been trying to figure out how to go about making a table of comments auto-refresh when someone inserts from a comment form without refreshing the whole page.I've tried looking into AJAX for this, but everything I have looked at, in terms of tutorials, just flies right over my head, and I can't really make much sense of it.
View 2 Replies
View Related
Nov 27, 2011
This is what I want to know. I have a table which has the number of rows depended on what the number is in the spinner. This does work e.g If I enter 25 in spinner it comes up with 25 rows, if I enter 7 in spinner comes with 7 rows.
So my problem is this: Lets say there are a number of rows in a table. What I have is a textarea where the user enters in their question and then submits the question, the question should be inserted and appear in the first row of the table under the "Question" column, the textarea goes blank and the user enters in his second question, if the user submits this then the question would appear in the second row, 3rd question into 3rd row, 4th question 4th into row etc.
Problem is that I do not know how to do this. I have attempted trying to do it but when I try and submit my first question the first row of the table under the "Question" column outputs "[object HTMLTableCellElement]". Why does this happen and can somebody please be able to show me how to achieve what I want to achieve.
[Code]...
View 14 Replies
View Related
May 26, 2010
Is is possible to have a Radio button, when selected, insert an image into a table(or something)? Each Radio button changing the previous image. I figure it would be an array, or maybe its a simple onclick, both of which I've tried, but I am fairly new to this. I'll show you the code, and hopefully you can figure out what I mean.
[Code]....
View 7 Replies
View Related
Aug 30, 2010
I'm using a text field to insert images into a table cell. I have 360 images. the text field uses the onkeyup to change the image. when I type the number 1, the appropriate image appears. But when I type another number, giving me say 17 nothing happens.
The function uses parseInt to access the value int the text field. I'm fairly sure the onkeyup function is not retricted the the first character typed. Why would the onkeyup not execute after the second character is typed?
View 6 Replies
View Related
Oct 6, 2010
I have a form which goes to my insert page which inserts the data into the table. Except I didn't want to do a redirect to another page so I thought I would do an Ajax call. Both pages work until I change it to an ajax call.
I am pretty certain that it is because I took out the <form action="insert.php"> because otherwise the page would redirect but if that is the case I don't know my way around it and if it isn't the problem I'm not sure what is.
But here is my code:
Form:
View 5 Replies
View Related
Jul 23, 2005
I currently have an iframe on a webpage into which users can insert content. They can further customise the text as I've included buttons such as Bold, Italic, Bullet point etc. This is done along the lines of
<td><div class="cbtn" onClick="cmdExec('bold',idContent)"
onmouseover="button_over(this);" onmouseout="button_out(this);"
onmousedown="button_down(this);" onmouseup="button_up(this);">
<img hspace="1" vspace=1 align=absmiddle src="images/Bold.gif"
alt="Bold">
</div></td>
But has anyone found a way of creating a table for insertion in an Iframe. A much bigger task I realise but I'm not keen on users copying tables from Word and inserting them into the iframe.
View 2 Replies
View Related
Jul 23, 2005
The document object has a method called createElement. Can I use this
method to create a new Drop/down list, like:
var sel = document.createElement('SELECT');
I have seen it used like this:
opt = document.createElement('OPTION');
which means that opt now holds an option that can be appended to an already
existing select object.
Are there any restrictions for which arguments createElement can be called
with? I have seen: var what is "LI"? Where do I need to look to find valid arguments for createElement??
View 1 Replies
View Related
Jul 23, 2005
I have a snippet of code below that creates a new input element for a
checkbox and sets some attributes.
var observationCheckbox = document.createElement('input');
observationCheckbox.setAttribute('type', 'checkbox');
observationCheckbox.setAttribute('id', 'observation.' + runningCount +
'.species');
observationCheckbox.setAttribute('name', 'observation.' + runningCount +
'.species');
observationCheckbox.setAttribute('value', 's' + speciesCode);
Question: Is it possible to set this checkbox to be 'checked' when it is
created? I'm not sure if this constitutes an attribute or not.
View 2 Replies
View Related
Jul 23, 2005
I have a page which uses JavaScript to create form elements using
document.createElement('input'), etc.. Both Firefox and IE have no
problem accomplishing this and when the form is submitted all the
information is passed correctly.
I am now trying to validate the form using JavaScript when the page is
submitted. Firefox has no problems with this but IE returns
'document.form1.*THE FORM FIELD*.value is null or not an object' for
the elements that were created using document.createElement when I try
get their value using 'document.form1.*THE FORM FIELD*.value'. How do
I get the value of the form elements that were created using
JavaSCript?
View 2 Replies
View Related
Nov 25, 2006
I try the following in Firefox and other modern browsers:
window.addEventListener('load', function() {
document.title = CSS.getClass('fontSize');
var div = document.createElement('div');
document.getElementsByTagName('body')[0].appendChild(div);
alert(div);
alert(div.style)
}, true);
It works fine in normal HTML mode (Content-type: text/html), but in
XHTML mode it alerts "[object Element]" instead of "[object
HTMLDivElement]" and the second alert shows "undefined" instead of
"[object CSSStyleDeclaration]". So I can't reach the style declaration
which is important for me. Strict mode makes trouble again and again,
the biggest bug: document.write does not work:
View 10 Replies
View Related
Jul 31, 2006
this works perfectly in firefox - but in internet explorer it just creates the first lable and the input field, although it creates the input field as a regular text field instead of for files. the caption label and text field aren't created at all. any ideas? Code:
View 7 Replies
View Related
Mar 26, 2010
This is driving me insane. I'm trying to use createElement inside a loop to make some <divs>, each of which has an onclick event. I threw together this test page to demonstrate it:
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
[Code]....
When I click on any of the boxes it alerts "5", the final value of x after the loop ends, instead of what the value of x was when the loop executed and created the element ("0", "1", "2", etc.). This is happening if FF and ie.
I also noticed in Firebug if I put a breakpoint on the "yay.onclick=function(){alert(x)}" line that it will break everytime I click on one of the boxes. Very strange...
How can I put in a variable on the yay.onclick=function(){alert(x)} line and have it "stick"?
View 5 Replies
View Related
