Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations Chriss Miller on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

select html table cell values when clicking on a row

Status
Not open for further replies.

aintruder123

IS-IT--Management
Jul 23, 2006
5
US
Hi guys, I’m trying to do script that selects a specific cell value when I click on a specific row. Example, if I have a table of 4(rows) x 4(columns)
1 2 3 4
5 6 7 8
9 10 11 12
13 14 15 16

I want to select the 9 and the 10 when I click on the row. Better yet, regardless of the number of the row that I click (I can have 200 rows) I want to select any cell value I specify I want to select from the row I click.


I really need help, I new to JavaScript and I’m going; NUTS !

Thanks in advance.
 
something like this?

Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>
<head>
	<title>Untitled</title>

<script type="text/javascript"><!--

function getVal(e) {
    var targ;
    if (!e) var e = window.event;
    if (e.target) targ = e.target;
    else if (e.srcElement) targ = e.srcElement;
    if (targ.nodeType == 3) // defeat Safari bug
        targ = targ.parentNode;

    alert(targ.innerHTML);
}

onload = function() {
    var t = document.getElementById("main").getElementsByTagName("td");
    for ( var i = 0; i < t.length; i++ )
        t[i].onclick = getVal;
}

//--></script>
    
<style type="text/css">

#main td {
    border: 1px solid gray;
}

</style>
</head>

<body>

<table id="main"><tr>
    <td>1</td>
    <td>2</td>
    <td>3</td>
    <td>4</td>
</tr><tr>
    <td>5</td>
    <td>6</td>
    <td>7</td>
    <td>8</td>
</tr><tr>
    <td>9</td>
    <td>10</td>
    <td>11</td>
    <td>12</td>
</tr></table>

</body>
</html>



*cLFlaVA
----------------------------
[tt]( <P> <B>)13 * (<P> <.</B>)[/tt]

[URL unfurl="true"]http://www.coryarthus.com/[/url]
 
cLFlaVA, first of all thanks for your post and i really apreciate your help, sorry i'm replaying this late, but i thought no one was gonna answer myquestion since i have this question on other forums and i've had no aswer yet. The code you wrote is sort of what i need. What i need is when i click on a row (not a cell) return the values from the cell i want. Example, on the code your wrote, you have a 3x4 table, when i click on the first row i need to retun 1 and 2 regardless where i click on that row, or 5 and 6 if i click on the second row and so on.
 
ok, same kind of concept. here's an example, you'll need to modify it to suit your needs. All I did was change the main function.

Code:
function getVal(e) {
    var valOne, valTwo;
    var theCell, theRow;

    // get the row that was clicked
    if (!e) var e = window.event;
    if (e.target) theCell = e.target;
    else if (e.srcElement) theCell = e.srcElement;
    if (theCell.nodeType == 3) // defeat Safari bug
        theCell = theCell.parentNode;

    theRow = theCell.parentNode;
    // get the value in the first cell of the row
    valOne = theRow.getElementsByTagName("td")[0].innerHTML;
    // get the value in the second cell of the row
    valTwo = theRow.getElementsByTagName("td")[1].innerHTML;

    alert("First cell: " + valOne + "\nSecond cell: " + valTwo);
}



*cLFlaVA
----------------------------
[tt]( <P> <B>)13 * (<P> <.</B>)[/tt]

[URL unfurl="true"]http://www.coryarthus.com/[/url]
 
dude, your a life saver, 100 thanks to you...

it works now...
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top