How to play this value for an input field?

Question

I need to get the id of an item on my list and fill in the input with this id. So far with some searches I was able to choose which of the options and display the id in an Alert, but I need to fill the tcod input with the id value, I tried with attr and prop but no result. Could you help me ?

$(".tt").click(function() {
  var valor = $(this).parent().parent().find('.tes');
  alert(valor.html());
}

<label>Codigo<span style="color:red">*</span></label>
<input class="form-control" type="number" name="tcod" required>
<?php

$nome = $_POST['nome'];

$sql = "SELECT * FROM `cad` WHERE nome LIKE '%$nome%' ";
$ex = mysqli_query($conn, $sql);

          
        while($rows = $ex->fetch_array()){
        echo "<tr>";
        echo "<td class='tes'>".$rows['idcad']." </td>";
        echo "<td>".$rows['nome']." </td>";
        echo "<td>".$rows['nome_mae']." </td>";
        echo "<td>".$rows['idade']." </td>";    
        echo "<nav id='edita'>";     
        echo "<td><i class='fa fa-search tt' id='cod' value=''></i></td>";
        echo "</nav>";

        echo "</tr>";   
        
       
        
    }
}
?>

Answer 1

Note that the input you want to fill in is of the type number, so you’ll only accept numbers. If the id you want to pick up and play on the field is not a number, the field will be empty and a warning will be shown in the browser console.

To pick up the cell text .tes from the same line as the button clicked, you use .closest("tr") to find the button line, and then the .find(".tes") to find the cell. Use .text() to pick up the text inside the cell and .trim() to clear possible spaces before and after the text. Then use .val() to change the input value.

You don’t have to use .parent() 2 times. The .closest() already goes straight to the parent element where you want to get. See:

$(".tt").click(function() {
  var valor = $(this).closest("tr").find('.tes');
   $("[name='tcod']").val(valor.text().trim());
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.2/css/all.css" integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr" crossorigin="anonymous">

<label>Codigo<span style="color:red">*</span></label>
<input class="form-control" type="number" name="tcod" required>
<table border="1">
   <tr>
      <td class='tes'>1</td>
      <td>nome1</td>
      <td>nome mãe 1</td>
      <td>18 anos</td>
      <td>
         <i class='fa fa-search tt' id='cod' value=''></i>
      </td>
   </tr>
   <tr>
      <td class='tes'>2</td>
      <td>nome2</td>
      <td>nome mãe 2</td>
      <td>20 anos</td>
      <td>
         <i class='fa fa-search tt' id='cod' value=''></i>
      </td>
   </tr>
</table>

Answer 2

In fact this question should not be tagged with PHP.

But if you want to set the input id use:

$(".tt").click(function() {
  var valor = $(this).parent().parent().find('.tes');
   /* define o valor do input name=tcod */
  $('input[name="tcod"]').attr("id", valor.html() );
}

If you want to set the input value name="tcod", just use:

$(".tt").click(function() {
  var valor = $(this).parent().parent().find('.tes');
   /* define o valor do input name=tcod */
  $('input[name="tcod"]').val(valor.html());
}