How to take a table row's column to form input field

83 views Asked by At

I have a table of data. First column of table is button; on the button there is a onclick event. One other column is firmName I want to set txtFirm name field of form section the selected row's firm Name column.

My javaScript is as follows, but it does not work as expected

function callme(e) {
  var tds = e.getElementsByTagName('td');
  document.getElementById("txtFirmaAdi").value = tds[1].innerHTML.trim();
}
<table id="ctl03_ucOzgecmisTecrube_ctlGridSgkTecrube">
  <tbody>
    <tr>
      <th>İşyeri Sicil No</th>
      <th>İşyeri Adı</th>
      <th>Meslek Kodu</th>
      <th>Meslek</th>
      <th>Süre</th>
      <th>Baş Tar</th>
      <th>Bit Tar</th>
    </tr>
    <tr>
      <td><input type="submit" name="ctl03$ucOzgecmisTecrube$ctlGridSgkTecrube$ctl02$btnAktar" value="Aktar" onclick="return callme(this);" id="ctl03_ucOzgecmisTecrube_ctlGridSgkTecrube_ctl02_btnAktar" class="inp"></td>
      <td>43821010110221190210174</td>
      <td>GELİŞİM TEM.İNŞ.GIDA TEL.SAN.TİC.LTD.ŞTİ.</td>
      <td>&nbsp;</td>
      <td>&nbsp;</td>
      <td>240</td>
      <td>&nbsp;</td>
      <td>31.12.2004</td>
    </tr>
  </tbody>
</table>

1

There are 1 answers

0
mplungjan On

You are passing the button to the function.

Use .closest to find the parent

Firm name in your code is in the 2nd column (according to Google Translate of İşyeri Adı) zero based - so td[1], but you have a very long number there 43821010110221190210174 which seems to match a İşyeri Sicil No

If I add a <th></th> and change to td[2] it makes more sense

function callme(button) {
  const number = button.closest("tr").querySelectorAll("td")[2].textContent.trim(); 
  document.getElementById("txtFirmaAdi").value = number;
}
<table id="ctl03_ucOzgecmisTecrube_ctlGridSgkTecrube">
  <tbody>
    <tr>
      <th>&nbsp;</th>
      <th>İşyeri Sicil No</th>
      <th>İşyeri Adı</th>
      <th>Meslek Kodu</th>
      <th>Meslek</th>
      <th>Süre</th>
      <th>Baş Tar</th>
      <th>Bit Tar</th>
    </tr>
    <tr>
      <td><input type="submit" name="ctl03$ucOzgecmisTecrube$ctlGridSgkTecrube$ctl02$btnAktar" value="Aktar" onclick="return callme(this);" id="ctl03_ucOzgecmisTecrube_ctlGridSgkTecrube_ctl02_btnAktar" class="inp"></td>
      <td>43821010110221190210174</td>
      <td>GELİŞİM TEM.İNŞ.GIDA TEL.SAN.TİC.LTD.ŞTİ.</td>
      <td>&nbsp;</td>
      <td>&nbsp;</td>
      <td>240</td>
      <td>&nbsp;</td>
      <td>31.12.2004</td>
    </tr>
  </tbody>
</table>
<input type="text" id="txtFirmaAdi" value="" />