<TBODY ID="oTBody">
var oRow = oTBody.insertRow(0)
How to Build Tables Dynamically
Здравствуйте!
Нужно таблицы создавать динамически. Пытаюсь разобраться. Имею:
<html>
<head>
<SCRIPT LANGUAGE="JavaScript" SRC="script.js">
function addrow() {
var sarr = new Array;
sarr[0] = "InsRow";
sarr[1] = "val1";
sarr[2] = "val2";
sarr[3] = "val3";
var oRow = oTBody.insertRow(0);
for (var i=0; i<4; i++)
{
var oCell = oRow.insertCell();
oCell.innerText = sarr;
}
}
function delrow() {
oTBody.deleteRow(0);
}
</SCRIPT>
<title>Test page</title>
</head>
<body>
<TABLE ID="oTable" border="1">
<TR>
<TH>AAA</TH>
<TH>BBB</TH>
<TH>CCC</TH>
<TH>DDD</TH>
</TR>
<TBODY ID="oTBody">
</TBODY>
<TR>
<TD COLSPAN="4">EEE</TD>
</TR>
</TABLE>
<br/>
<input type="button" onclick="addrow()" value="AddRow">
<input type="button" onclick="delrow()" value="DelRow">
</body>
</html>
Открываю этот html-файл в IE - все работает, открываю в Opera - болт. Строки в таблицу добавляются, а вот колонки - нет. Почему? Как надо?
И еще вопросец - если в таблице нету строк и нажать кнопку удалить (на моей страничке), то появляется ошибка. Как узнать кол-во строк в таблице/в TBODY?
Нужно таблицы создавать динамически. Пытаюсь разобраться. Имею:
<html>
<head>
<SCRIPT LANGUAGE="JavaScript" SRC="script.js">
function addrow() {
var sarr = new Array;
sarr[0] = "InsRow";
sarr[1] = "val1";
sarr[2] = "val2";
sarr[3] = "val3";
var oRow = oTBody.insertRow(0);
for (var i=0; i<4; i++)
{
var oCell = oRow.insertCell();
oCell.innerText = sarr;
}
}
function delrow() {
oTBody.deleteRow(0);
}
</SCRIPT>
<title>Test page</title>
</head>
<body>
<TABLE ID="oTable" border="1">
<TR>
<TH>AAA</TH>
<TH>BBB</TH>
<TH>CCC</TH>
<TH>DDD</TH>
</TR>
<TBODY ID="oTBody">
</TBODY>
<TR>
<TD COLSPAN="4">EEE</TD>
</TR>
</TABLE>
<br/>
<input type="button" onclick="addrow()" value="AddRow">
<input type="button" onclick="delrow()" value="DelRow">
</body>
</html>
Открываю этот html-файл в IE - все работает, открываю в Opera - болт. Строки в таблицу добавляются, а вот колонки - нет. Почему? Как надо?
И еще вопросец - если в таблице нету строк и нажать кнопку удалить (на моей страничке), то появляется ошибка. Как узнать кол-во строк в таблице/в TBODY?
Цитата: GHopper
Здравствуйте!
Нужно таблицы создавать динамически. Пытаюсь разобраться. Имею:
<html>
<head>
<SCRIPT LANGUAGE="JavaScript" SRC="script.js">
function addrow() {
var sarr = new Array;
sarr[0] = "InsRow";
sarr[1] = "val1";
sarr[2] = "val2";
sarr[3] = "val3";
var oRow = oTBody.insertRow(0);
for (var i=0; i<4; i++)
{
var oCell = oRow.insertCell();
oCell.innerText = sarr;
}
}
function delrow() {
oTBody.deleteRow(0);
}
</SCRIPT>
<title>Test page</title>
</head>
<body>
<TABLE ID="oTable" border="1">
<TR>
<TH>AAA</TH>
<TH>BBB</TH>
<TH>CCC</TH>
<TH>DDD</TH>
</TR>
<TBODY ID="oTBody">
</TBODY>
<TR>
<TD COLSPAN="4">EEE</TD>
</TR>
</TABLE>
<br/>
<input type="button" onclick="addrow()" value="AddRow">
<input type="button" onclick="delrow()" value="DelRow">
</body>
</html>
Открываю этот html-файл в IE - все работает, открываю в Opera - болт. Строки в таблицу добавляются, а вот колонки - нет. Почему? Как надо?
И еще вопросец - если в таблице нету строк и нажать кнопку удалить (на моей страничке), то появляется ошибка. Как узнать кол-во строк в таблице/в TBODY?
Нужно таблицы создавать динамически. Пытаюсь разобраться. Имею:
<html>
<head>
<SCRIPT LANGUAGE="JavaScript" SRC="script.js">
function addrow() {
var sarr = new Array;
sarr[0] = "InsRow";
sarr[1] = "val1";
sarr[2] = "val2";
sarr[3] = "val3";
var oRow = oTBody.insertRow(0);
for (var i=0; i<4; i++)
{
var oCell = oRow.insertCell();
oCell.innerText = sarr;
}
}
function delrow() {
oTBody.deleteRow(0);
}
</SCRIPT>
<title>Test page</title>
</head>
<body>
<TABLE ID="oTable" border="1">
<TR>
<TH>AAA</TH>
<TH>BBB</TH>
<TH>CCC</TH>
<TH>DDD</TH>
</TR>
<TBODY ID="oTBody">
</TBODY>
<TR>
<TD COLSPAN="4">EEE</TD>
</TR>
</TABLE>
<br/>
<input type="button" onclick="addrow()" value="AddRow">
<input type="button" onclick="delrow()" value="DelRow">
</body>
</html>
Открываю этот html-файл в IE - все работает, открываю в Opera - болт. Строки в таблицу добавляются, а вот колонки - нет. Почему? Как надо?
И еще вопросец - если в таблице нету строк и нажать кнопку удалить (на моей страничке), то появляется ошибка. Как узнать кол-во строк в таблице/в TBODY?
как вообще это работает где-либо
var oRow = oTBody.insertRow(0); - что за бред?
oTBody - вы сами написали что это id (<TBODY ID="oTBody">)
может вот так
var oTBody - document.getElementById("oTBody");
var oRow = oTBody.insertRow(0);
а вообще читаем вот тут
http://www.w3schools.com/htmldom/dom_obj_table.asp
http://www.w3schools.com/htmldom/dom_obj_tablerow.asp
http://www.w3schools.com/htmldom/dom_obj_tabledata.asp
все довольно просто и понятно
Цитата: KiLLMeNoT
как вообще это работает где-либо
var oRow = oTBody.insertRow(0); - что за бред?
oTBody - вы сами написали что это id (<TBODY ID="oTBody">)
может вот так
var oTBody - document.getElementById("oTBody");
var oRow = oTBody.insertRow(0);
а вообще читаем вот тут
http://www.w3schools.com/htmldom/dom_obj_table.asp
http://www.w3schools.com/htmldom/dom_obj_tablerow.asp
http://www.w3schools.com/htmldom/dom_obj_tabledata.asp
все довольно просто и понятно
var oRow = oTBody.insertRow(0); - что за бред?
oTBody - вы сами написали что это id (<TBODY ID="oTBody">)
может вот так
var oTBody - document.getElementById("oTBody");
var oRow = oTBody.insertRow(0);
а вообще читаем вот тут
http://www.w3schools.com/htmldom/dom_obj_table.asp
http://www.w3schools.com/htmldom/dom_obj_tablerow.asp
http://www.w3schools.com/htmldom/dom_obj_tabledata.asp
все довольно просто и понятно
MSDN Library 2006
закладка Index, ключевое слово "How to Build Tables Dynamically". Там вы увидите один в один пример, представленный мною... скажите тогда как в таком документе пишут такой бред!!?
За линк спасибо. Буду читать.
Цитата: GHopper
MSDN Library 2006
закладка Index, ключевое слово "How to Build Tables Dynamically". Там вы увидите один в один пример, представленный мною... скажите тогда как в таком документе пишут такой бред!!?
За линк спасибо. Буду читать.
закладка Index, ключевое слово "How to Build Tables Dynamically". Там вы увидите один в один пример, представленный мною... скажите тогда как в таком документе пишут такой бред!!?
За линк спасибо. Буду читать.
Вы разве до сих пор не знаете что и МСДН может ошибаться? его тоже люди писали, могли ошибиться
недавно скопировал пример оттуда и что..он хрен работал, пришлось искать и править ошибки
а по поводу примера вы в думайтесь в смысл написанного
Код:
oTBody по первой строке это ID - т.е string
Во второй строке вы работаете с ним как с обьектом
на мой взгляд полный бред не хватает вот этого
var oTBody = document.getElementById("oTBody");
Цитата: KiLLMeNoT
Вы разве до сих пор не знаете что и МСДН может ошибаться? его тоже люди писали, могли ошибиться
недавно скопировал пример оттуда и что..он хрен работал, пришлось искать и править ошибки
а по поводу примера вы в думайтесь в смысл написанного
oTBody по первой строке это ID - т.е string
Во второй строке вы работаете с ним как с обьектом
на мой взгляд полный бред не хватает вот этого
var oTBody = document.getElementById("oTBody");
недавно скопировал пример оттуда и что..он хрен работал, пришлось искать и править ошибки
а по поводу примера вы в думайтесь в смысл написанного
Код:
<TBODY ID="oTBody">
var oRow = oTBody.insertRow(0)
var oRow = oTBody.insertRow(0)
oTBody по первой строке это ID - т.е string
Во второй строке вы работаете с ним как с обьектом
на мой взгляд полный бред не хватает вот этого
var oTBody = document.getElementById("oTBody");
В IE это будет работать - он позволяет обращаться к объектам по их ID
<span id='test' class='test_class'></span>
<script>
alert(test.className)
</script>
А вот насчет остальных браузеров не знаю...
Я немного изменил код в пользу DOM...вроде работает
<html>
<head>
<SCRIPT LANGUAGE="JavaScript">
function addrow()
{
var i;
var parent = document.getElementById('oTBody');
var sarr = new Array;
sarr[0] = "InsRow";
sarr[1] = "val1";
sarr[2] = "val2";
sarr[3] = "val3";
var tr = document.createElement('tr');
for (i=0; i<4; i++)
{
var td = document.createElement('td');
var text = document.createTextNode(sarr);
td.appendChild(text);
tr.appendChild(td);
}
parent.appendChild(tr)
}
function delrow()
{
var i;
var parent = document.getElementById('oTBody');
if(parent.childNodes.length>0)
{
parent.removeChild(parent.childNodes[parent.childNodes.length-1])
}
}
</SCRIPT>
<title>Test page</title>
</head>
<body>
<TABLE ID="oTable" border="1">
<TR>
<TH>AAA</TH>
<TH>BBB</TH>
<TH>CCC</TH>
<TH>DDD</TH>
</TR>
<TBODY ID="oTBody">
</TBODY>
<TR>
<TD COLSPAN="4">EEE</TD>
</TR>
</TABLE>
<br/>
<input type="button" onclick="addrow()" value="AddRow">
<input type="button" onclick="delrow()" value="DelRow">
</body>
</html>
Насчет удаления строк - он удаляет с конца....
<html>
<head>
<SCRIPT LANGUAGE="JavaScript">
function addrow()
{
var i;
var parent = document.getElementById('oTBody');
var sarr = new Array;
sarr[0] = "InsRow";
sarr[1] = "val1";
sarr[2] = "val2";
sarr[3] = "val3";
var tr = document.createElement('tr');
for (i=0; i<4; i++)
{
var td = document.createElement('td');
var text = document.createTextNode(sarr);
td.appendChild(text);
tr.appendChild(td);
}
parent.appendChild(tr)
}
function delrow()
{
var i;
var parent = document.getElementById('oTBody');
if(parent.childNodes.length>0)
{
parent.removeChild(parent.childNodes[parent.childNodes.length-1])
}
}
</SCRIPT>
<title>Test page</title>
</head>
<body>
<TABLE ID="oTable" border="1">
<TR>
<TH>AAA</TH>
<TH>BBB</TH>
<TH>CCC</TH>
<TH>DDD</TH>
</TR>
<TBODY ID="oTBody">
</TBODY>
<TR>
<TD COLSPAN="4">EEE</TD>
</TR>
</TABLE>
<br/>
<input type="button" onclick="addrow()" value="AddRow">
<input type="button" onclick="delrow()" value="DelRow">
</body>
</html>
Насчет удаления строк - он удаляет с конца....