Learn how to a build a cloud-first strategyRegister Now

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 204
  • Last Modified:

Read data from textbox which is in html table using javascript

Hi

I have textbox in the html table , now i want to read the data from this textbox for each row using javascript
can you please suggest.

0
praveen1981
Asked:
praveen1981
1 Solution
 
sonawanekiranCommented:
Look at below code

Test page :
http://jsfiddle.net/4Qxm6/
<html>
<head>
<meta http-equiv="Content-Language" content="en-gb">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Kiran Test</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js" type="text/javascript"></script>

<script>
$(document).ready(function(){
     $("#btn").click(function(){
       ReadData();
     });
        
  });
  
  function ReadData()
  {
    
     $("table#my_table tr").each(function(){
       alert($(this).find('td:first input').val() + " " + $(this).find('td:last input').val());
     });
  }

</script>
</head>

<body>
  <table width="200" border="1" id="my_table">
    <tr>
        <td>
          <input type="text" name="FirstName" id="FirstName" value="Andy" />
        </td>
        <td>
          <input type="text" name="LastName" id="LastName" value="Flower" />
        </td>
    </tr>
   <tr>
        <td>
          <input type="text" name="FirstName1" id="FirstName1" value="Steve"/>
        </td>
        <td>
          <input type="text" name="LastName1" id="LastName1" value="English"/>
        </td>
    </tr>
    <tr>
        <td>
          <input type="text" name="FirstName2" id="FirstName2" value="Robert" />
        </td>
        <td>
          <input type="text" name="LastName2" id="LastName2" value="Sanford" />
        </td>
    </tr>
   
</table>

<input id="btn" type="button" value="Read Data">




</body>

</html>

Open in new window

0
 
Gurvinder Pal SinghCommented:
first get the handle to that row of the table

var rows = document.getElementById("myTable").rows;

for ( var rowCounter = 0; rowCounter < rows.length; rowCounter++)
{
  var row = rows[ rowCounter ];
  //get access to the textbox
  var allInputs = row.getElementsByTagName("input");

  for ( var allInputCounter = 0; allInputCounter < allInputs.length; allInputCounter++)
  {
     var input = allInputs[ allInputCounter ];
     if ( input.getAttribute("type") == "text" )
    {
        alert("my textbox value is " + input.value);
    }
  }
}
0
 
praveen1981Author Commented:
Many thanks, it solved the Problem
0

Featured Post

Free Tool: ZipGrep

ZipGrep is a utility that can list and search zip (.war, .ear, .jar, etc) archives for text patterns, without the need to extract the archive's contents.

One of a set of tools we're offering as a way to say thank you for being a part of the community.

Tackle projects and never again get stuck behind a technical roadblock.
Join Now