JavaScript - Como identificar el click en una tabla

 
Vista:
sin imagen de perfil

Como identificar el click en una tabla

Publicado por galiux (3 intervenciones) el 10/03/2015 07:01:23
Hola: Tengo una tabla que no puedo resolver, el caso es que se genera una tabla a partir de una consulta a la base de datos, dicha tabla consta de 3 columnas []id_marca[nombre_marca][accion] en la columna acción, tiene la palabra "editar". La idea es que cuando den click en la palabra "editar" puedan editar o actualizar el campo [nombre_marca]. Tengo el siguiente script en el que estoy tratando de leer el valor de la columna [nombre marca] en la fila que hicieron el click sobre la palabra "editar".
===========================================================================================
1
2
3
4
5
6
7
8
9
10
11
12
13
14
var f=0;
var arreglo2;
function hacerclic(){
    arreglo=document.getElementsByClassName("editar");
    arreglo2=document.getElementsByClassName("marca");
 
    for(;f<arreglo.length&&f<arreglo2.length;f++){
 
        arreglo[f].addEventListener('click',function(){
            alert("hiciste click en: "+arreglo2[0].innerHTML);
        },false);
    }
}
window.onload=hacerclic;
===========================================================================================
como podran ver, puedo accesar al valor de la columna [nombre_marca] que esta en un <td> con el nombre de clase "marca" pero lo hago en la posicion cero, debido a que no he encontrado la manera de leer el valor del campo marca sobre la fila que hicieron click en la columna [accion] que tiene la palabra "editar".
Si alguien puede apoyarme en esto les agradecería.
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de xve
Val: 3.162
Oro
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

Como identificar el click en una tabla

Publicado por xve (2100 intervenciones) el 10/03/2015 10:08:24
Hola Galiux, nos puedes mostrar la tabla para poder probar el código?

a simple vista parece que esta bien.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
sin imagen de perfil

Como identificar el click en una tabla

Publicado por galiux (3 intervenciones) el 11/03/2015 01:48:02
Claro que si; tengo 2 archivos el primero "modificar_marca.php"

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
<!DOCTYPE html>
<html lang="es">
<head>
	<title>
		A L M A C E N
	</title>
	<script type="text/javascript" src="editar_marca.js"></script>
	<?php
		require("consultas.php");
	?>
	<link rel="stylesheet" type="text/css" href="estilos.css">
</head>
 
<body>
	<div id="cabecera">
		ALMACEN
	</div>
	<section id="opciones_menu">
		OPCIONES DE MENU<br><br>
	<a class="menu" href="Almacen.php">Marcas</a>
	</section>
	<div id="fondo_opciones_marca">
		<div id="menu_agregar_marca">
			<a class="menu" href="agregar_marca.php">Agregar Marca</a>
		</div>
		<div id="menu_modificar_marca">
			Modificar Marca
		</div>
		<div id="menu_eliminar_marca">
			Eliminar Marca
		</div>
	</div>
	<div id="tablas">
 
		<?php
			$resultado_query=consulta_mysql2("select *from marca");
			echo "<table border='1'>";
			echo "<tr><td>CLAVE</td><td>NOMBRE</td><td>ACCION</td></tr>";
			$cont=0;
			while($resEmp=mysql_fetch_assoc($resultado_query)){
				echo "<tr ><td>".$resEmp['id_marca']."</td><td class="."marca".">".$resEmp['marca']."</td><td class="."editar".">editar".$cont."</td></tr>";
				$cont++;
			}
			echo "</table>";
		?>
	</div>
</body>

el segundo archivo es donde tengo el javascript de nombre "editar_marca.js"
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
var f=0;
var arreglo2;
function hacerclic(){
    arreglo=document.getElementsByClassName("editar");
    arreglo2=document.getElementsByClassName("marca");
 
 
    for(;f<arreglo.length&&f<arreglo2.length;f++){
 
        arreglo[f].addEventListener('click',function(){
            alert("hiciste click en: "+arreglo2[0].innerHTML);
        },false);
    }
}
window.onload=hacerclic;


tmp
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar

Como identificar el click en una tabla

Publicado por galiux (3 intervenciones) el 12/03/2015 02:01:15
Bueno pues por si a alguien le sirve lo pude solucionar con jquery de la siguiente manera:

====================================================================================
$(document).ready(function(){ //Espera a que el documento este listo
$(".editar").click(function(evento){//selecciono el td que tenga de nombre de clase "editar"

var nombre_marca=$(this).prev();//obtengo la celda previa de donde se hizo click
alert("el valor de indice: "+nombre_marca.html());//se muestra el valor
});
}
);

====================================================================================
Espero que a alguien le pueda servir.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar

modifcar carrito de compras

Publicado por mauro (1 intervención) el 05/02/2020 21:58:43
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
// cuando se modifica el precio efectivo, modifica las otras celdas, me hace la suma y multiplcacion, pero siempre de el primer renglon del carrito de compras, creado con un foreach, cuando modifico la cantidad me calcula y modifica la celda de percio, pero si quiero modificar segundo renglon no me hace nada,,,,
 
<script>
      $(document).ready(function () {
          $("#PrecioEfec").keyup(function () {
              var valuee = $(this).val();
              var valuet = $(this).val() * 1.25;
              $("#PrecioTarj").val(valuet);
              $("#FinalCont").val(valuee) * $("#cantidad").val();
              $("#FinalTarj").val(valuet) * $("#cantidad").val();
              //console.log(this.id); lo saque y anda igual
 
          });
      });
 
</script>
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar