Question

I have a html table for display user list. when i click a tr row, that time it will find the td values to text-box which is in another html table.

Assume, the given below html table is user list table,

<table id="tbl1" border="1">
   <tr>
       <td>name</td>
   </tr>
   <tr id="tr1" style='cursor:pointer;'>
       <td>Mani</td>
   </tr>
</table>

And the given below html table for when we click a row in above html table dynamically assign the td values to text-box , like

<table id="tbl2">
   <tr>
       <td><input id="txt1" type="text"  /></td>
   </tr>
</table>
<br/>
<input type="button" id="btnReset" value="reset" />

What i did, when i click a row in that table, i get a html data & assign this to a global variable & when i click reset button that time, just i insert the html values to the #tbl2.

My jquery code is given below,

var getHTML="";

$("#tr1").click(function(){    
   $("#txt1").val($(this).find('td').html());
   getHTML=$("#tbl2").html();
});

$("#btnReset").click(function(){
    $("#tbl2").html(getHTML);
});

It’s working but text-box value are empty, How to i get the dynamic text-box values from html table.

Check here

Answer 1

Try this

$("#txt1").attr('value', $(this).find('td').text());

instead of

$("#txt1").val($(this).find('td').text());

to add the value in your text box source like

<input id="txt1" type="text" value="Mani">

Update: Or you may try this too.