Connecting Tech Pros Worldwide Help | Site Map

javascript+get next element value in table

  #1  
Old September 2nd, 2008, 10:05 AM
Newbie
 
Join Date: Jan 2008
Location: Malaysia
Posts: 28
if i have a table like below, is it any javascript methods use a object as parameter to retrieve the next object b? like document.getNextElement?

[HTML]<form method="post" action="send.jsp">
<table>
<tr>
<td><input type="text" name="a" /></td>
<td><input type="text" name="b" /></</td>
<td><input type="text" name="c" /></</td>
<td><input type="text" name="d" /></</td>
</tr>

<tr>
<td><input type="text" name="e" /></</td>
<td><input type="text" name="f" /></</td>
<td><input type="text" name="g" /></</td>
<td><input type="text" name="h" /></</td>
</tr>
</table>
</form>[/HTML]

Last edited by acoder; September 2nd, 2008 at 01:14 PM. Reason: Added [code] tags
  #2  
Old September 2nd, 2008, 10:36 AM
Dormilich's Avatar
Moderator
 
Join Date: Aug 2008
Location: Leipzig, Germany
Posts: 3,487
Provided Answers: 9

re: javascript+get next element value in table


in this case I would use getElementsByTagName("input") and loop through the result array. Another way is to use the nextSibling/previousSibling/parentNode/childNodes properties of the node object.
  #3  
Old September 2nd, 2008, 01:06 PM
RamananKalirajan's Avatar
Needs Regular Fix
 
Join Date: Mar 2008
Location: Chennai - India
Posts: 341

re: javascript+get next element value in table


I hope this will help u out

[HTML]<html>
<head>
<script type="text/javascript">
function doThis(ths)
{
var x=(ths.id).toString();
var i=x.indexOf('r');
var num = parseInt(x.substring((i+1),x.length));
var table = document.getElementById("myTable");
var row = table.rows[num-1];
var first=row.cells[0].innerHTML;
var second = row.cells[1].innerHTML;
document.getElementById('myText1').value=first;
document.getElementById('myText2').value=second;
}
</script>
</head>
<body>
<p>Click on any Element in the Table</p>
<br/>
<table id="myTable" border="1" cellpadding="5" cellspacing="5">
<tr id="tr1" onclick="doThis(this)">
<td>Hai1</td><td>Hello1</td>
</tr>
<tr id="tr2" onclick="doThis(this)">
<td>Hai2</td><td>Hello2</td>
</tr>
<tr id="tr3" onclick="doThis(this)">
<td>Hai3</td><td>Hello3</td>
</tr>
<tr id="tr4" onclick="doThis(this)">
<td>Hai4</td><td>Hello4</td>
</tr>
<tr id="tr5" onclick="doThis(this)">
<td>Hai5</td><td>Hello5</td>
</tr>
</table> <br/>
<input type="text" id="myText1">&nbsp;&nbsp;&nbsp;&nbsp; <input type="text" id="myText2">
</body>
</html>[/HTML]
This will be helpful if the data is within td

Regards
Ramanan Kalirajan

Last edited by RamananKalirajan; September 2nd, 2008 at 01:08 PM. Reason: havent seen the requirement clearly
  #4  
Old September 2nd, 2008, 01:14 PM
RamananKalirajan's Avatar
Needs Regular Fix
 
Join Date: Mar 2008
Location: Chennai - India
Posts: 341

re: javascript+get next element value in table


Hope this satisfies ur requirement

[HTML]<html>
<head>
<script type="text/javascript">
function doThis(ths)
{
var x=(ths.id).toString();
var i=x.indexOf('r');
var num = parseInt(x.substring((i+1),x.length));
var table = document.getElementById("myTable");
var row = table.rows[num-1];
var first=row.cells[0].childNodes[0].value;
var second = row.cells[1].childNodes[0].value;
document.getElementById('myText1').value=first;
document.getElementById('myText2').value=second;
}
</script>
</head>
<body>
<p>Click on any Element in the Table</p>
<br/>
<table id="myTable" border="1" cellpadding="5" cellspacing="5">
<tr id="tr1" onclick="doThis(this)">
<td><input type="text" value="Hai1"></td><td><input type="text" value="Hello1"></td>
</tr>
<tr id="tr2" onclick="doThis(this)">
<td><input type="text" value="Hai2"></td><td><input type="text" value="Hello2"></td>
</tr>
<tr id="tr3" onclick="doThis(this)">
<td><input type="text" value="Hai3"></td><td><input type="text" value="Hello3"></td>
</tr>
<tr id="tr4" onclick="doThis(this)">
<td><input type="text" value="Hai4"></td><td><input type="text" value="Hello4"></td>
</tr>
<tr id="tr5" onclick="doThis(this)">
<td><input type="text" value="Hai5"></td><td><input type="text" value="Hello5"></td>
</tr>
</table> <br/>
<input type="text" id="myText1">&nbsp;&nbsp;&nbsp;&nbsp; <input type="text" id="myText2">
</body>
</html>[/HTML]

Regards
Ramanan Kalirajan
  #5  
Old September 3rd, 2008, 11:52 AM
Newbie
 
Join Date: Jan 2008
Location: Malaysia
Posts: 28

re: javascript+get next element value in table


thank you, this code very useful for me.
  #6  
Old September 4th, 2008, 06:10 AM
RamananKalirajan's Avatar
Needs Regular Fix
 
Join Date: Mar 2008
Location: Chennai - India
Posts: 341

re: javascript+get next element value in table


Quote:
Originally Posted by webster5u
thank you, this code very useful for me.
In future any probs, post it to the forum, i will try to help u out

Regards
Ramanan Kalirajan
Reply


Similar Threads
Thread Thread Starter Forum Replies Last Post
set Focus to next form element blindly dlite922 answers 2 January 21st, 2008 06:49 PM
Script for adding and deleting rows to a table Muzzy answers 2 June 23rd, 2006 12:05 PM
video in javascript chrisdude911 answers 8 March 28th, 2006 09:25 AM
Move focus to next element mcanedo answers 7 July 23rd, 2005 04:22 PM