soy nuevo programando y mi pregunta es la siguiente, Tengo una tabla HTML que se llena en automático de acuerdo a los registros de la Base, quisiera que al seleccionar cualquier checkbox, me arrojara una alerta mostrando Id, nombre y Ap_Materno, de la fila correspondiente. Hice una prueba asignando al id y value del checkbox, los valores de la tabla, pero solo me arroja el id y nombre, mas no el apellido, esto quisiera hacerlo con Javascrip
Mi tabla
<?php
//Se incluye la conexion
include_once 'conexion.php';
$sql = "SELECT * FROM registros";
$stmt = $conexion->prepare($sql);
$stmt->execute();
$resultado = $stmt-> get_result();
?>
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="estilo.css">
<title>Listado de Personas</title>
</head>
<body>
<br><br>
<div class="contenedor">
<h1> Listado de Usuarios </h1>
<table id="tabla">
<thead>
<tr>
<th>Selecciona</th>
<th>ID</th>
<th>Nombres</th>
<th>Apellido Paterno</th>
<th>Apellido Materno</th>
</tr>
</thead>
<tbody >
<?php foreach ($resultado as $fila){ ?>
<!-- Se muestra el valor de cada columna en la tabla, Asigno al check en id y value los valores que deseo obtener en la alerta -->
<tr>
<td><input type="checkbox" id="<?php echo $fila ['id']; ?>" name="checkname" value="<?php echo $fila ['nombre']; ?>" class="classchk"></td>
<td id="id"><?php echo $fila ['id']; ?></td>
<td id="nombre"><?php echo $fila ['nombre']; ?></td>
<td id="ap_pat"><?php echo $fila ['ap_paterno']; ?></td>
<td id="ap_mat"><?php echo $fila ['ap_materno']; ?></td>
</tr>
<?php }; ?>
</tbody>
</table>
</div>
</body>
<script src="alerta.js"></script>
</html>
Mi Funcion en JS
var tabla=document.getElementById("tabla");
tabla.addEventListener('change', function(e){
e.preventDefault(); /
var checkboxes = document.getElementsByName('checkname');
for(var i=0; i<checkboxes.length; i++){
if(checkboxes[i].checked==true){
alert("El id seleccionado es: "+checkboxes[i].id+" y nombre es: "+checkboxes[i].value);
}
}
});
td
no tienen valores; tienen texto entre sus etiquetas de apertura y cierre.