javascript+get next element value in table

Collapse
X
Collapse
 
  • Page of 1
  • Time
  • Show
Clear All
new posts
Previous template Next
  • webster5u
    New Member
    • Jan 2008
    • 28
    #1

    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.getNex tElement?

    [HTML]<form method="post" action="send.js p">
    <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; Sep 2 '08, 12:14 PM. Reason: Added [code] tags
    Tags: None
    • Dormilich
      Recognized Expert Expert
      • Aug 2008
      • 8694
      #2
      in this case I would use getElementsByTa gName("input") and loop through the result array. Another way is to use the nextSibling/previousSibling/parentNode/childNodes properties of the node object.

        Comment

        • RamananKalirajan
          Contributor
          • Mar 2008
          • 608
          #3
          I hope this will help u out

          [HTML]<html>
          <head>
          <script type="text/javascript">
          function doThis(ths)
          {
          var x=(ths.id).toSt ring();
          var i=x.indexOf('r' );
          var num = parseInt(x.subs tring((i+1),x.l ength));
          var table = document.getEle mentById("myTab le");
          var row = table.rows[num-1];
          var first=row.cells[0].innerHTML;
          var second = row.cells[1].innerHTML;
          document.getEle mentById('myTex t1').value=firs t;
          document.getEle mentById('myTex t2').value=seco nd;
          }
          </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">&n bsp;&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; Sep 2 '08, 12:08 PM. Reason: havent seen the requirement clearly

            Comment

            • RamananKalirajan
              Contributor
              • Mar 2008
              • 608
              #4
              Hope this satisfies ur requirement

              [HTML]<html>
              <head>
              <script type="text/javascript">
              function doThis(ths)
              {
              var x=(ths.id).toSt ring();
              var i=x.indexOf('r' );
              var num = parseInt(x.subs tring((i+1),x.l ength));
              var table = document.getEle mentById("myTab le");
              var row = table.rows[num-1];
              var first=row.cells[0].childNodes[0].value;
              var second = row.cells[1].childNodes[0].value;
              document.getEle mentById('myTex t1').value=firs t;
              document.getEle mentById('myTex t2').value=seco nd;
              }
              </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">&n bsp;&nbsp;&nbsp ;&nbsp; <input type="text" id="myText2">
              </body>
              </html>[/HTML]

              Regards
              Ramanan Kalirajan

                Comment

                • webster5u
                  New Member
                  • Jan 2008
                  • 28
                  #5
                  thank you, this code very useful for me.

                    Comment

                    • RamananKalirajan
                      Contributor
                      • Mar 2008
                      • 608
                      #6
                      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

                        Comment

                        Previous template Next
                        Working...