简体   繁体   中英

(Jquery) Find the contents of a td from a selected tr

I am very new to JQuery, so appologies for what may be a very simple question.

I have a table, and when i click on a row, i want the cells details to be filled into a form:

so simple example

<table id="table">
 <tr><td class="field1">1 </td><td class="field2">2 </td></tr>
</table>
<input id="input" type="text" />

So the JQuery:

$(document).ready(function() {
   $('#table tr').click(function() {
       $test = $(this).find('td').context.innerText) //problem here *
       $('#input').val( );
   })
  • this returns the innertext of the tr (ie "1 2"

How am i supose to do it...

Thanks in advance

Andy

Edit: ok in my rush i see i messed up what i was supose to type, here is the js i am trying:

$(document).ready(function() {
   $('#table tr').click(function() {
       $field1 = $(this).find('td.field1').context.innerText) //problem here *
       $('#input1').val($field1);
       $field2 = $(this).find('td.field2').context.innerText) //problem here *
       $('#input12').val($field2);
   })

Appologies for the confusion

If you want the text of each cell to be captured as a singe space-separated string to populate your input, you can do this:

$(document).ready(function() {
   $('#table tr').click(function() {
       var $test = $(this).find('td').map(function() {
           return $(this).text();
       }).get().join(" ");
       $('#input').val($test);
   });
});

EDIT just call text() , eg:

var $field1 = $(this).find('td.field1').text();

It worked for me:

HTML:

<tr class="" id="tr_id" >
    <td class="l_id">7283630222</td>
</tr>
<tr class="" id="tr_id" >
    <td class="l_id">7276684022</td>
</tr>
<input tyxp="text" id="leadID"></input>

jQuery:

$(document).ready(function(){
    $("tr#tr_id").click(function(){
        $("#hiddenDiv").show();
        $("#leadID").val($(this).find("td.l_id").text());
    });
});
$(document).ready(function() { 
   var $test="";
   $('#table tr>td').click(function() { 
       $test = $(this).text(); 
       $('#input').val($test);
   )};
});

alernative:

$(document).ready(function() { 
  var $test ="";
  $('.field1, #table').click(function() { 
      $test = $(this).text(); 
      $('#input').val($test); 
  )};
  $('.field2, #table').click(function() { 
    $test = $(this).text(); 
    $('#input').val($test); 
  )};
});

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM