2010-09-21 2 views
2

J'ai le tableau suivant. Je veux copier la valeur Id sur la ligne sélectionnée dans la zone de texte. Si je clique sur le lien "Select" dans la première ligne, la valeur de la zone de texte sera 0001.Copier la valeur de cellule du tableau dans la zone de texte

Si la table doit être modifiée pour obtenir un résultat meilleur et plus rapide, veuillez laisser votre suggestion.

<div> 
    <input id="selectedId" type="text" /> 
    </div> 

    <table cellspacing="1" class="tablesorter" id="nameList"> 
    <thead> 
     <tr> 
     <th class="header">Name</th> 

     <th class="header">Id</th> 

     <th class="header">Gender</th> 

     <th>Select</th> 
     </tr> 
    </thead> 

    <tbody> 
     <tr> 
     <td>Akom Smith</td> 

     <td>0001</td> 

     <td>M</td> 

     <td><a href="#" class="click-to-select">Select</a></td> 
     </tr> 

     <tr> 
     <td>Amara Sahara</td> 

     <td>0002</td> 

     <td>F</td> 

     <td><a href="#" class="click-to-select">Select</a></td> 
     </tr> 

     <tr> 
     <td>John Lache</td> 

     <td>0003</td> 

     <td>M</td> 

     <td><a href="#" class="click-to-select">Select</a></td> 
     </tr> 
    </tbody> 
    </table> 

Répondre

4

essayer,

$('a.click-to-select').click(function() { 
    var id = $(this).closest('tr').find('td').eq(1).text(); 
    $('#selectedId').val(id); 
    return false; 
});​ 

simple cool demo

ajouté des notes pour le commentaire ci-dessous.

$('a.click-to-select').click(function() { 
    var id = $(this).closest('tr').find('td.id').text(); 
    $('#selectedId').val(id); 
    return false; 
});​ 

updated demo

+0

J'aime la démo cool. Je vous remercie. Si vous avez une classe 'td' comme celle-ci 0001, comment serait la syntaxe? – Narazana

+1

voir les notes ajoutées;) – Reigel

0

Eh bien, vous savez que votre clé est la deuxième td de la ligne. Vous pouvez utiliser le sélecteur: nième enfant comme celui-ci:

<script type="text/javascript"> 
var getUniqueId = function() { 
    return $('td:nth-child(2)').text(); 
} 
</script> 

Bien sûr, vous avez besoin d'un moyen d'identifier le bon, mais je suppose que le code est censé être appelé depuis et là, vous pouvez utiliser le sélecteur de parent .

Sinon, je mettrais un attribut id dans chaque ligne pour faciliter la sélection.