Táblázat elemeinek onClick eseményei

mokat · 2009. Aug. 26. (Sze), 15.40

Sziasztok:

Egy táblázatba listázok ki eseményeket és hozzá kapcsolódó egyéb adatokat (php-val mysql-ből), és azt szeretném megoldani, hogy ha rákattint valaki az egyik eseményre (cellára) akkor az behoz egy másik oldalt aminek átadja a cella tartalmát változóként.
De már ott elakadtam, hogy az adott eseményre kattintva ki szeretném "alert" ablakba írni a kiválasztott cella tartalmát, ugyanis mindig a legelső cella tartalma íródik ki. Gondolom valmelyiket léptetni kéne, de akkor is honnét tudja majd, hogy melyikre kattintottam?

Lebutítva a script:
<table>

$esemenylistazo = mysql_query("SELECT meccslista, H, D, V, ervenyesseg, vegeredmeny FROM hategy") or die(mysql_error());

while($info = mysql_fetch_array( $esemenylistazo ))

{
Print "<tr>
<td id='esemenyTD' onClick='katt()')>".$info['meccslista']."</td>
<td align=center>".$info['H']."</td>
<td align=center>".$info['D']."</td>
<td align=center>".$info['V']."</td>
<td align=center>".$info['ervenyesseg']."</td>
<td align=center>".$info['vegeredmeny']."</td>
</tr>";
}

?>
</table>

<script type="text/javascript">
function katt() {
x=document.getElementById("esemenyTD");
window.location="masikoldal.php";
alert(x.firstChild.nodeValue);
};

</script>

minden segítségért előre is köszi!

■

HTML, CSS, JavaScript, Ajax

csirip

id = egyedi

gex · 2009. Aug. 26. (Sze), 16.10

ha minden cellának esemenyTD id-t adsz, akkor ne csodálkozz hogy az elsőt fogja visszaadni. honnan tudná hogy melyiket adja vissza?

olvasd el András cikkét, hasznos lesz.

A hozzászóláshoz regisztráció és belépés szükséges
új téma

csak pelda

duplabe · 2009. Aug. 26. (Sze), 16.28

hogy legyen honnan elindulnod:

<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body>
<table id="tablacska">
<tr>
<td>booo</td>
<td>bááá</td>
<td>béééé</td>
</tr>
<tr>
<td>bőőőő</td>
<td>bűűűű</td>
<td>bíííí</td>
</tr>
</table>
<script type="text/javascript">
var td = document.getElementById('tablacska').getElementsByTagName('td');
for(var i=0;i<td.length;i++)
{
td[i].onclick = function()
{
alert(this.innerHTML);
}
}
</script>
</body>
</html>

<html lang="en">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    </head>
    <body>
        
        <table id="tablacska">
            <tr>
                <td>booo</td>
                <td>bááá</td>
                <td>béééé</td>
            </tr>
            <tr>
                <td>bőőőő</td>
                <td>bűűűű</td>
                <td>bíííí</td>
            </tr>
        </table>
        <script type="text/javascript">            
            var td = document.getElementById('tablacska').getElementsByTagName('td');
            for(var i=0;i<td.length;i++)
            {
                td[i].onclick = function()
                {
                    alert(this.innerHTML);
                }
            }
        </script>
    </body>
</html>

A hozzászóláshoz regisztráció és belépés szükséges
új téma

bjutifull

mokat · 2009. Aug. 26. (Sze), 18.26

köszi!!!!! átjavítottam működik. <3 weblabor&javascript <3
azért a lelkek megnyugtatása végett:

<table id="esemenylista">

<?php

$esemenylistazo = mysql_query("SELECT meccslista, H, D, V, ervenyesseg, vegeredmeny FROM hategy") or die(mysql_error());

while($info = mysql_fetch_array( $esemenylistazo ))

{
Print "<tr><td>".$info['meccslista']."</td><td align=center>".$info['H']."</td><td align=center>".$info['D']."</td><td align=center>".$info['V']."</td><td align=center>".$info['ervenyesseg']."</td><td align=center>".$info['vegeredmeny']."</td></tr>";
}

?>

</table>

<script type="text/javascript">
var td = document.getElementById('esemenylista').getElementsByTagName('td');
for(var i=0;i<td.length;i++)
{
td[i].onclick = function()
{
alert(this.innerHTML);
}
}
</script>

A hozzászóláshoz regisztráció és belépés szükséges
új téma

mondjuk...

mokat · 2009. Aug. 27. (Cs), 11.22

egyetlen apróság még maradt. Azért akartam én az 'esemény' td-jét valami id-val megjelölni hogy csak arra az egy bizonyos oszlopra szeretném, hogy működjön. Tehát a kiválasztott sor első td-jét dobja fel, legyen akárhova kattintok az adott sorban:

A hozzászóláshoz regisztráció és belépés szükséges
új téma

akkor a tablabol nem a

duplabe · 2009. Aug. 27. (Cs), 11.32

akkor a tablabol nem a td-ket, hanem a tr-eket gyujtod le, majd ezen belul a td-ket. ezek kozul veszed mindig az elsot, es arra raksz onclick esemenyt.

kb igy:

var tr = document.getElementById('tablacska').getElementsByTagName('tr');
for(var i=0;i<tr.length;i++)
{
tr[i].getElementsByTagName('td')[0].onclick = function()
{
alert(this.innerHTML);
}
}


            var tr = document.getElementById('tablacska').getElementsByTagName('tr');
            for(var i=0;i<tr.length;i++)
            {
                tr[i].getElementsByTagName('td')[0].onclick = function()
                {
                    alert(this.innerHTML);
                }
            }

ps: erdemes lenne megtanulni egy js frameworkot :) (pl: jQuery)

A hozzászóláshoz regisztráció és belépés szükséges
új téma

oopsz, most latom, hogy az

duplabe · 2009. Aug. 27. (Cs), 11.35

oopsz, most latom, hogy az egesz tr-re akarsz onclicket.

akkor:

var tr = document.getElementById('tablacska').getElementsByTagName('tr');
for(var i=0;i<tr.length;i++)
{
tr[i].onclick = function()
{
alert(this.getElementsByTagName('td')[0].innerHTML);
}
}


var tr = document.getElementById('tablacska').getElementsByTagName('tr');
            for(var i=0;i<tr.length;i++)
            {
                tr[i].onclick = function()
                {
                    alert(this.getElementsByTagName('td')[0].innerHTML);
                }
            }

A hozzászóláshoz regisztráció és belépés szükséges
új téma

mindig ez a szintaktika...

mokat · 2009. Aug. 27. (Cs), 12.55

nálam nagy mizéria ez a szokatlan nagybetű kisbetű váltogatás az elemeknél, valami ilyesmit hekkeltem össze, de peszre az életképtelen volt :) Köszi mégx1!

A hozzászóláshoz regisztráció és belépés szükséges
új téma

Weblabor

Keresés