When I click on the button in the javascript table, I want to select the select value in the modal that opens and write the row whose value is equal to the table. How can I?

`

<thead>

  <div class="h4 fw-bolder bg-danger p-1 text-center text-white" style="margin-bottom: 0; ">Arif Tangör Hoca</div>

  <tr class="table-dark">

    <th class="text-nowrap" scope="col">Ad - Soyad</th>

    <th scope="col">1.D</th>

    <th scope="col">2.D</th>

    <th scope="col">3.D</th>

    <th scope="col">4.D</th>

    <th scope="col">5.D</th>

    <th scope="col">6.D</th>

    <th scope="col">7.D</th>

    <th scope="col">8.D</th>

    <th scope="col">9.D</th>

    <th scope="col">10.D</th>

    <th scope="col">11.D</th>

    <th scope="col">İşlem Ekle</th>

    <th scope="col">İşlem Sil</th>


  </tr>

</thead>

<tbody>

  <tr>

    <th class="text-nowrap" scope="row">Kazım Yılmaz</th>

    <td class="catid" value="1">2000</td>

    <td class="catid" value="2">2000</td>

    <td class="catid" value="3">2000</td>

    <td class="catid" value="4">2000</td>

    <td class="catid" value="5">2000</td>

    <td class="catid" value="6"></td>

    <td class="catid" value="7"></td>

    <td class="catid" value="8"></td>

    <td class="catid" value="9"></td>

    <td class="catid" value="10"></td>

    <td class="catid" value="11"></td>

    <td style="padding-left: 0; padding-right: 0; border: 0; " class="text-nowrap">

Para Ekle

    <td style="padding-left: 0; padding-right: 0;" class="text-nowrap">

Sil

    <th class="text-nowrap" scope="row">Ömer Tangör</th>

    <td></td>

    <td></td>

    <td></td>

    <td></td>

    <td></td>

    <td></td>

    <td></td>

    <td></td>

    <td></td>

    <td></td>

    <td></td>

    <td style="padding-left: 0; padding-right: 0; border: 0; " class="text-nowrap">

Para Ekle

Sil

  </tr>

  <tr>

    <th class="text-nowrap" scope="row">Fatih Baş</th>

    <td></td>

    <td></td>

    <td></td>

    <td></td>

    <td></td>

    <td></td>

    <td></td>

    <td></td>

    <td></td>

    <td></td>

    <td></td>

    <td style="padding-left: 0; padding-right: 0; border: 0; " class="text-nowrap">

Para Ekle

Sil

<div class="modal-dialog">

  <div class="modal-content">

    <div class="modal-header">

      <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>

    </div>

    <div class="modal-body">

      <label for="" class="fw-bolder form-label">Hangi Döneme Eklenecek?</label>

      <select name="" class="form-select" required>

        <option value="">Seçiniz</option>

        <option value="1">1</option>

        <option value="2">2</option>

        <option value="3">3</option>

        <option value="4">4</option>

        <option value="5">5</option>

        <option value="6">6</option>

        <option value="7">7</option>

        <option value="8">8</option>

        <option value="9">9</option>

        <option value="10">10</option>

        <option value="11">11</option>

      </select>

      <label for="" class="mt-3 fw-bolder form-label">Eklenecek Tutar</label>

      <input type="text" class="form-control">


    </div>

    <div class="modal-footer">

      <button type="button" class="btn btn-danger fw-bolder" data-bs-dismiss="modal">Vazgeç</button>

      <button type="button" class="btn btn-success fw-bolder" onclick="islem()">Ekle&Kaydet</button>

    </div>

  </div>

</div>

`

When I click on the button in the javascript table, I want to select the select value in the modal that opens and write the row whose value is equal to the table. How can I?