Отметка времени для динамически создаваемых строк в таблице - PullRequest
Новая
       36

Отметка времени для динамически создаваемых строк в таблице

0 голосов
/ 20 марта 2020

У меня есть таблица со строками, которые динамически добавляются с помощью кнопки, которая удваивается как отметка времени для этой строки. В настоящее время он работает только для первого ряда. Поле времени должно быть редактируемым и иметь возможность использовать кнопку отметки времени после того, как эта строка будет сделана, в случае, если ошибка сделана так, как это делает первая строка. После многих дней просмотра других вопросов и ответов я чувствую, что иду по кругу. Я сократил код, чтобы удалить все форматирование, которое у меня было. Любая конструктивная критика приветствуется, но постарайтесь go легко, последний раз, когда я делал кодирование, было 25 лет go в колледже:) 

<!DOCTYPE html>
<html>
<head>
<title>IDT Logs</title>
</head>
<body>

<table id="empTable">

        <tr>
            <th>UNIT</th>
            <th>--</th>
            <th>TIME</th>

        </tr>
        <tr>
            <td> <input type="text" style="text-align:center; width: 100%"> </td>
            <td> <input id="starttime_button" name = "starttime_button" type="button" value="Time" style="background-color:lightgrey" onclick="setStartTime(),addRow()" /></td>
            <td> <input style="text-align:center; width: 100%" type="text" id="starttime" name="starttime" value="" /></td>
                <script>
                    function setStartTime(){document.getElementById('starttime').value = new Date().toLocaleTimeString('it-IT');}
                </script>

        </tr>
</table>

<script>

var arrHead = new Array();
arrHead = ['Unit', 'timebutton', 'timebox'];     

function addRow() {
    var idtTab = document.getElementById('empTable');
    var rowCnt = idtTab.rows.length;        // GET TABLE ROW COUNT.
    var tr = idtTab.insertRow(rowCnt);     
    tr = idtTab.insertRow(rowCnt);

    for (var c = 0; c < arrHead.length; c++) {
        var td = document.createElement('td');          
        td = tr.insertCell(c);

        if (c === 0) {           // Unit COLUMN.
            var unit = document.createElement('input');
            unit.setAttribute('type', 'text');
            unit.setAttribute('value', '');
            unit.style.width = "100%";
            unit.style.textAlign = "center";
            td.appendChild(unit);
        }

        if (c === 1) {           // Timebutton COLUMN.
            var timebutton = document.createElement('input');
            timebutton.setAttribute('type', 'button');
            timebutton.setAttribute('style', 'background-color: lightgrey');
            timebutton.setAttribute('value', 'Time');
            timebutton.setAttribute('onclick', 'setStartTime(),addRow()');
            td.appendChild(timebutton);
        }

        if (c === 2) {           // timebox COLUMN.
            var timebox = document.createElement('input');
            timebox.setAttribute('type', 'text');
            timebox.setAttribute('value', '');
            timebox.style.width = "100%";
            timebox.style.textAlign = "center";
            td.appendChild(timebox);
        }
    }
}


</script>
</body>
</html>
...