function addNewRow() {
var medication = document.getElementById("medicinename");
var timeOfDay = document.getElementById("time");
var treatmentDuration = document.getElementById("duration");
var timing = document.getElementById("when");
var tableData = document.getElementById("myTableData");
var currentRowCount = tableData.rows.length;
var newRow = tableData.insertRow(currentRowCount);
newRow.insertCell(0).innerHTML= '<input type="button" value = "Delete" onClick="Javacsript:deleteRow(this)">';
newRow.insertCell(1).innerHTML= medication.value;
newRow.insertCell(2).innerHTML= timeOfDay.value;
newRow.insertCell(3).innerHTML= treatmentDuration.value;
newRow.insertCell(4).innerHTML= timing.value;
var cellToUpdate=newRow.insertCell(1);
var inputElement =document.createElement("input");
inputElement.type = "text";
inputElement.setAttribute("name", "productDynamic");
var medName=medication.value;
inputElement.value = medName;
cellToUpdate.appendChild(inputElement);
}
In this code snippet, an onclick function is used in JavaScript to insert values into a table. There are 5 columns in the table, and a delete button is inserted in the first column. However, there seems to be an issue with var cel2=row.insertcell(1)
, as it ends up displaying 6 columns instead of 5. If anyone familiar with JavaScript could provide assistance regarding this problem, it would be greatly appreciated. Additionally, when passing a value through a textfield, everything works correctly. Yet, using a select field with option values causes the value not to be captured, even after implementing
element2.setattribute("name","productDynamic");
. Any suggestions on how to resolve this issue?