#javascript #html
Вопрос:
Я пытаюсь добавить кнопку в определенную ячейку таблицы, а также номер строки в той же таблице, но в другой ячейке. Мне нужно добавлять одну новую кнопку после каждой отправки кнопки, а также увеличивать номер строки после добавления новой строки после отправки кнопки.
Мне нужно вставить номера строк в столбец ID=»Порядковый номер» и кнопку в столбец id=»recordUpdateList».
спасибо за помощь
HTML
lt;/headgt; lt;bodygt; lt;h1gt;Manažment inventáralt;/h1gt; lt;h2gt;Pridať nový inventár: lt;/h2gt; lt;form id="inventoryInputForm" action="addInventory" method="post" name="inputForm"gt; lt;label for="InventoryLocationLabel"gt;Lokácia:lt;/labelgt; lt;input type="text" name="inventoryLocationInput" id="inventoryLocation" autocomplete="off"gt; lt;label for="inventoryNameLabel"gt;Názov inventára:lt;/labelgt; lt;input type="text" name="inventoryNameInput" id="inventoryName" autocomplete="off"gt; lt;label for="invnetoryIDLabel"gt;ID Inventára:lt;/labelgt; lt;input type="text" name="inventoryIDInput" id="inventoryID" autocomplete="off"gt; lt;input type="button" id="submitButton" value="Uložiť inventár" onclick="addField();"gt; lt;/formgt; lt;h2gt;Inventárny zoznam:lt;/h2gt; lt;table id="inventoryTableHead" class="css-serial"gt; lt;trgt; lt;th name="textTable" id="orderNumberTableHead" class="text-center"gt;Poradové číslolt;/thgt; lt;th name="textTable" id="locationTableHead" class="text-center"gt;Lokácialt;/thgt; lt;th name="textTable" id="inventoryNameTaleHead" class="text-center"gt;Názov inventáralt;/thgt; lt;th name="textTable" id="inventoryIDTablehead" class="text-center"gt;ID inventáralt;/thgt; lt;th name="textTable" id="recordUpdateTableHead" class="text-center"gt;Upraviť záznamlt;/thgt; lt;th name="textTable" id="recordDeleteTableHead" class="text-center"gt;!!!Zmazať položku!!!lt;/thgt; lt;/trgt; lt;tbody id="tbody"gt; lt;tr id="inventoryList"gt; lt;div id="orderNumberList"gt;lt;/divgt; lt;div id="locationList"gt;lt;/divgt; lt;div id="inventoryNameList"gt;lt;/divgt; lt;div id="inventoryIDList"gt;lt;/divgt; lt;div id="recordUpdateList"gt;lt;/divgt; lt;div id="recordDeleteList"gt;lt;/divgt; lt;/trgt; lt;/tbodygt; lt;tfootgt;lt;/tfootgt; lt;/tablegt;
JS
document.getElementById("submitButton").onclick = function (e) { e.preventDefault(); const inventoryTable = document.getElementById("inventoryTableHead"); const row = inventoryTable.insertRow(); const orderNumber = row.insertCell(); const location = row.insertCell(); const name = row.insertCell(); const id = row.insertCell(); const btnUpdateRecord = row.insertCell(); orderNumber.innerHTML = document.getElementById(""); location.innerHTML = document.getElementById("inventoryLocation").value; name.innerHTML = document.getElementById("inventoryName").value; id.innerHTML = document.getElementById("inventoryID").value; console.log("new row was added") inventoryLocation.value = ""; inventoryName.value = ""; inventoryID.value = ""; }```