Connecting Tech Pros Worldwide Help | Site Map

javascript+get next element value in table

 
LinkBack Thread Tools Search this Thread
  #1  
Old September 2nd, 2008, 09:05 AM
Newbie
 
Join Date: Jan 2008
Location: Malaysia
Posts: 22
Default javascript+get next element value in table

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 12:14 PM. Reason: Added [code] tags
Reply
  #2  
Old September 2nd, 2008, 09:36 AM
Dormilich's Avatar
Moderator
 
Join Date: Aug 2008
Location: Leipzig, Germany
Age: 32
Posts: 2,209
Default

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.
Reply
  #3  
Old September 2nd, 2008, 12:06 PM
RamananKalirajan's Avatar
Needs Regular Fix
 
Join Date: Mar 2008
Location: Chennai - India
Age: 24
Posts: 297
Default

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 12:08 PM. Reason: havent seen the requirement clearly
Reply
  #4  
Old September 2nd, 2008, 12:14 PM
RamananKalirajan's Avatar
Needs Regular Fix
 
Join Date: Mar 2008
Location: Chennai - India
Age: 24
Posts: 297
Default

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
Reply
  #5  
Old September 3rd, 2008, 10:52 AM
Newbie
 
Join Date: Jan 2008
Location: Malaysia
Posts: 22
Default

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

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
Reply

Bookmarks

Thread Tools Search this Thread
Search this Thread:

Advanced Search


Popular Articles

What is Bytes?

We are a network of experts and professionals in IT and software development that help one another with answers to tough questions and share insights. Get the best answers to your questions from over 220,840 network members.