JSFiddle - React, Tailwind, and code Playground

by SLonoed

HTML

<table>
<tbody align="center" style="background: #fff; height: 25px;" class="d_table">

    <tr class="14">
        <td type="name">1</td>
        <td type="family">2</td>
        <td type="kolvo">3</td>
        <td type="razmer">4</td>
        <td type="stats" style="background-color: #f2f2f2;">5</td>
        <td type="aaa">6</td>
    </tr>
    
    <tr class="14">
        <td type="name">13</td>
        <td type="family">24</td>
        <td type="kolvo">35</td>
        <td type="razmer">46</td>
        <td type="stats" style="background-color: #f2f2f2;">5364</td>
        <td type="aaa">34646</td>
    </tr>

   
</tbody>
</table>

<br/>
<br/><br/>
Якобы попап:
<br/>
<div id="popup">
    name: <input class="name"><br/>
    family: <input class="family"><br/>
    kolvo: <input class="kolvo"><br/>
    razmer: <input class="razmer"><br/>
    stats: <input class="stats"><br/>
    aaa: <input class="aaa"><br/>
</div>

CSS

table {
border-top:1px solid #e5eff8;
border-right:1px solid #e5eff8;

border-collapse:collapse;
}
td {
color:#678197;
border-bottom:1px solid #e5eff8;
border-left:1px solid #e5eff8;
padding:.3em 1em;
text-align:center;
}

JavaScript

$('.d_table tr').click(function(){
    // this -  элемент строки
    
    // проходим по всем td в строке
    $(this).find('td').each(function() {
        // тут this - ячейка
        // получаем содержимое ячейки
        var value = $(this).html();
        // и её тип
        var type = $(this).attr('type');
                
        // кладём значение в инпут попапа с классом равным типу
        $('#popup .' + type).val(value);
    });
});