DOM y tablas

vmac179 · #1 (**permalink**) 05/11/2008, 22:16

Hola amigos que tal ?? espero que bien

bueno después de saludar les expongo mi duda, que es la siguiente

Código PHP:

  <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 
<html> 
<head> 
<title>DOM con tablas</title> 
<meta http-equiv="content-type" content="text/html; charset=UTF-8"> 
<script> 
   var cont=1; 
        function addrow(tc1,tc2) { 
                var tbl = document.getElementById('tabla'); 
                var row = document.createElement('tr'); 
                var c0 = document.createElement('td') 
      c0.innerHTML=cont; 
      cont++; 
                var c1 = document.createElement('td') 
      c1.innerHTML=tc1; 
                var c2 = document.createElement('td') 
                var c3 = document.createElement('td') 
                var c4 = document.createElement('td') 
                var c5 = document.createElement('td') 
      c2.innerHTML=tc2; 
                row.appendChild(c0); 
                row.appendChild(c1); 
                row.appendChild(c2); 
                row.appendChild(c3); 
                row.appendChild(c4); 
                row.appendChild(c5); 
                tbl.appendChild(row); 
        } 
  
        function addrow2() { 
           var frm = document.getElementById('forma'); 
           addrow(frm.c1.value,frm.c2.value,frm.c3.value); 
        } 
</script> 
</head> 
<body> 
<h2>Demo de DOM con tablas</h2> 
<form id='forma'> 
Columna 1:<input type="text" name="c1"> 
Columna 2:<input type="text" name="c2"> 
Columna 3:<input type="text" name="c3"> 
Columna 4:<input type="text" name="c4"> 
Columna 5:<input type="text" name="c5"> 
<input type="button" value="add"  onclick="javascript:addrow2()"> 
<input type="reset"> 
</form> 
<br/> 
<table cellpadding="0" cellspacing="0" border="1"  id="tabla"> 
<tr> 
<td></td><th>col 1</th><th>col 2</th><th>col 3</th><th>col 4</th><th>col 5</th> 
</tr> 
</table> 
<hr> 
</body> 
</html>

resulta que me esta mostrando solo los primeros valores osea, 0-1-2 y los otros no :(

mi duda es como hacerlo o que tiene mal el codigo

de antemano muchas gracias
Salu2

foreverOdd · #2 (**permalink**) 06/11/2008, 09:05

Y como pensaste que te iba a insertar klos otros valores??? por arte de magia???

aqui esta el codigo

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>DOM con tablas</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<script>
var cont=1;
function addrow(tc1,tc2,tc3,tc4,tc5) {
var tbl = document.getElementById('tabla');
var row = document.createElement('tr');
var c0 = document.createElement('td')
c0.innerHTML=cont;
cont++;
var c1 = document.createElement('td')
c1.innerHTML=tc1;
var c2 = document.createElement('td')
var c3 = document.createElement('td')
var c4 = document.createElement('td')
var c5 = document.createElement('td')
c2.innerHTML=tc2;
c3.innerHTML=tc3;
c4.innerHTML=tc4;
c5.innerHTML=tc5;
row.appendChild(c0);
row.appendChild(c1);
row.appendChild(c2);
row.appendChild(c3);
row.appendChild(c4);
row.appendChild(c5);
tbl.appendChild(row);
}

function addrow2() {
var frm = document.getElementById('forma');
addrow(frm.c1.value,frm.c2.value,frm.c3.value,frm. c4.value,frm.c5.value);
}
</script>
</head>
<body>
<h2>Demo de DOM con tablas</h2>
<form id='forma'>
Columna 1:<input type="text" name="c1">
Columna 2:<input type="text" name="c2">
Columna 3:<input type="text" name="c3">
Columna 4:<input type="text" name="c4">
Columna 5:<input type="text" name="c5">
<input type="button" value="add" onclick="javascript:addrow2()">
<input type="reset">
</form>
<br/>
<table cellpadding="0" cellspacing="0" border="1" id="tabla">
<tr>
<td></td><th>col 1</th><th>col 2</th><th>col 3</th><th>col 4</th><th>col 5</th>
</tr>
</table>
<hr>
</body>
</html>

solo copia y pega, de nuevo

Suerte

vmac179 · #3 (**permalink**) 06/11/2008, 11:37

uffff muchas gracias.... me salvaste aunque le había hecho una modificacion mira te la dejo

Código PHP:

  <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>DOM con tablas</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<script>
   var cont=1; // numero de la fila
        function addrow(tc1,tc2,tc3,tc4,tc5) {
                var tbl = document.getElementById('tabla');
                var row = document.createElement('tr');
                var c0 = document.createElement('td')
      c0.innerHTML=cont;
      cont++;
                var c1 = document.createElement('td')
      c1.innerHTML=tc1;

                var c2 = document.createElement('td')
      c2.innerHTML=tc2;

                var c3 = document.createElement('td')
      c3.innerHTML=tc3;

                var c4 = document.createElement('td')
      c4.innerHTML=tc4;

                var c5 = document.createElement('td')
      c5.innerHTML=tc5;

      c1.innerHTML=tc1;
                row.appendChild(c0);
                row.appendChild(c1);
                row.appendChild(c2);
                row.appendChild(c3);
                row.appendChild(c4);
                row.appendChild(c5);
                tbl.appendChild(row);
        }
 
        function addrow2() {
           var frm = document.getElementById('forma');
           addrow(frm.c1.value,frm.c2.value,frm.c3.value,frm.c4.value,frm.c5.value); // celdas
        }
</script>
</head>
<body>
<h2>Demo de DOM con tablas</h2>
<form id='forma'>
Columna 1:<input type="text" name="c1">
Columna 2:<input type="text" name="c2">

Columna 3:<input type="text" name="c3">
Columna 4:<input type="text" name="c4">
Columna 5:<input type="text" name="c5">
<input type="button" value="add"  onclick="javascript:addrow2()">
<input type="reset">
</form>
<br/>
<table cellpadding="0" cellspacing="0" border="1"  id="tabla">
<tr>
<td></td><th>col 1</th><th>col 2</th><th>col 3</th><th>col 4</th><th>col 5</th>

</tr>
</table>
<hr>
</body>
</html>

a todo esto alguien sabe porque no funciona en IE ???