JSFiddle - React, Tailwind, and code Playground

by Terry Mun

HTML

<table>
    <tr>
        <td>Id1</td>
        <td>
            <input type='textbox' class='text' tabindex='1' />
        </td>
    </tr>
    <tr>
        <td>Id2</td>
        <td>
            <input type='textbox' class='text' tabindex='2' />
        </td>
    </tr>
    <tr>
        <td>Id4</td>
        <td>
            <input type='textbox' class='text' tabindex='3' />
        </td>
    </tr>
</table>

CSS

.text {
    width:80px;
    border:solid 1px #999;
    color:#000;
    text-align:center;
}

JavaScript

$(function () {
    $(".text").on("focus", function () {
        console.log("box selected");
    }).on("keydown", function(e) {
        if ((e.keyCode || e.which) == 9) {
            e.preventDefault();
            $(this).val($(this).val() + "    ");
        }
    });
});