Ahora queremos obtener el valor de cada celda de la tabla HTML usando Javascript al pulsar el botón enviar ...cómo obtener la TABLA HTML Particullar Cell Value usando javascript?
¿Cómo obtener los valores de las celdas de la tabla html ....
Si alguien tiene respuesta a esta PLZ, me ayuda a conseguir lo mismo ...
para obtener el texto de esta por células
<table>
<tr id="somerow">
<td>some text</td>
</tr>
</table>
puede utilizar este -
var Row = document.getElementById("somerow");
var Cells = Row.getElementsByTagName("td");
alert(Cells[0].innerText);
También puede utilizar la forma DOM para obtener el valor de la celda: células [0] .firstChild.data
Lea más sobre esto en mi puesto en http://js-code.blogspot.com/2009/03/how-to-change-html-table-cell-value.html
Usted puede obtener valor de la celda con JS incluso cuando haga clic en la celda:
.......................
<head>
<title>Search students by courses/professors</title>
<script type="text/javascript">
function ChangeColor(tableRow, highLight)
{
if (highLight){
tableRow.style.backgroundColor = '00CCCC';
}
else{
tableRow.style.backgroundColor = 'white';
}
}
function DoNav(theUrl)
{
document.location.href = theUrl;
}
</script>
</head>
<body>
<table id = "c" width="180" border="1" cellpadding="0" cellspacing="0">
<% for (Course cs : courses){ %>
<tr onmouseover="ChangeColor(this, true);"
onmouseout="ChangeColor(this, false);"
onclick="DoNav('http://localhost:8080/Mydata/ComplexSearch/FoundS.jsp?courseId=<%=cs.getCourseId()%>');">
<td name = "title" align = "center"><%= cs.getTitle() %></td>
</tr>
<%}%>
........................
</body>
Escribí la tabla HTML en JSP. Curso es un tipo. Por ejemplo, Curso cs, cs = objeto de tipo Curso que tenía 2 atributos: id, título. cursos es un objeto ArrayList of Course.
La tabla HTML muestra todos los títulos de cursos en cada celda. Así que la tabla tiene 1 columna sólo: course1 course2 Course3 ...... Tomando un lado:
onclick="DoNav('http://localhost:8080/Mydata/ComplexSearch/FoundS.jsp?courseId=<%=cs.getCourseId()%>');"
Esto significa que después usuario selecciona una celda de tabla, por ejemplo "course2", el título del curso: "Course2" se desplazará a la página donde la dirección URL está dirigiendo al usuario: http://localhost:8080/Mydata/ComplexSearch/FoundS.jsp. "Course2" llegará a la página FoundS.jsp. El identificador de "Course2" es courseId. Para declarar la variable courseDd, en la que se mantendrá CourseX, pones un "?" después de la URL y junto a ella el identificador.
Te lo dije por si acaso querrías usarlo porque busqué mucho y encontré preguntas como la mía. Pero ahora me enteré por el profesor, así que publico donde la gente preguntaba.
El ejemplo está funcionando. He visto.
function Vcount() {
var modify = document.getElementById("C_name1").value;
var oTable = document.getElementById('dataTable');
var i;
var rowLength = oTable.rows.length;
for (i = 1; i < rowLength; i++) {
var oCells = oTable.rows.item(i).cells;
if (modify == oCells[0].firstChild.data) {
document.getElementById("Error").innerHTML = " * duplicate value";
return false;
break;
}
}
Gracias! Funcionó para mí –
<td class="virtualTd" onclick="putThis(this)">my td value </td>
function putThis(control) {
alert(control.innerText);
}
var table = document.getElementById("someTableID");
var totalRows = document.getElementById("someTableID").rows.length;
var totalCol = 3; // enter the number of columns in the table minus 1 (first column is 0 not 1)
//To display all values
for (var x = 0; x <= totalRows; x++)
{
for (var y = 0; y <= totalCol; y++)
{
alert(table.rows[x].cells[y].innerHTML;
}
}
//To display a single cell value enter in the row number and column number under rows and cells below:
var firstCell = table.rows[0].cells[0].innerHTML;
alert(firstCell);
//Note: if you use <th> this will be row 0, so your data will start at row 1 col 0
No "x <= totalRows", debería ser "x
Simplemente .. #sometime mesa más grande cuando no podemos añadir el ID a cada tr
<table>
<tr>
<td>some text</td>
<td>something</td>
</tr>
<tr>
<td>Hello</td>
<td>Hel</td>
</tr>
</table>
<script>
var cell = document.getElementsByTagName("td");
var i = 0;
while(cell[i] != undefined){
alert(cell[i].innerHTML); //do some alert for test
i++;
}//end while
</script>
He encontrado esto como una forma más fácil de añadir fila . Lo sorprendente de esto es que no cambia el contenido de la tabla ya presente, incluso si contiene elementos de entrada.
row = `<tr><td><input type="text"></td></tr>`
$("#table_body tr:last").after(row) ;
Aquí #table_body es el id de la etiqueta cuerpo de la tabla.
gracias por su respuesta – Saravanan
y cómo obtener el nombre de la columna y la fila? –
Búsqueda por siempre para esto. ¡¡¡Gracias!!! – snapper