JSFiddle - React, Tailwind, and code Playground

HTML

<table BORDER=4 BORDERCOLOR=ORANGE width="300px">
    <tr>
        <td>Model:</td>
        <td>
            <select name="model" id="model">
                <option value="1">Name1</option>
                <option value="2">Name2</option>
                <option value="3">Name3</option>
                <option value="4">Name4</option>
            </select>
        </td>
    </tr>
</table>
<table BORDER=4 BORDERCOLOR=ORANGE width="120px" id="product_table">
    <tr>
        <td>
            <INPUT type="checkbox" name="chk_group" value="1" />
        </td>
        <td>1</td>
        <td>Name1</td>
        <td>1</td>
    </tr>
    <tr>
        <td>
            <INPUT type="checkbox" name="chk_group" value="1" />
        </td>
        <td>2</td>
        <td>Name2</td>
        <td>2</td>
    </tr>
    <tr>
        <td>
            <INPUT type="checkbox" name="chk_group" value="1" />
        </td>
        <td>3</td>
        <td>Name2</td>
        <td>3</td>
    </tr>
</table>

JavaScript

function findRowNumber() {
    var rowIdx;
    var rowData = [];
    var table = document.getElementById('product_table');
    var rows = table.getElementsByTagName('tr');
    var selectedRow;
    for (var i = 0; i < rows.length; i++) {
        rows[i].onclick = function () {
            rowIdx = this.rowIndex;
            selectedRow = rows[rowIdx];
            
            document.getElementById('model').value = selectedRow.cells[3].innerHTML;

        }

    }

}

findRowNumber();