Hello Dear's
I have UI PAGE:
<html>
<head>
<script type="text/javascript">
function addRow() {
var table = document.getElementById("dynamicTable");
var row = table.insertRow(table.rows.length);
var cell1 = row.insertCell(0);
var cell2 = row.insertCell(1);
var cell3 = row.insertCell(2);
cell1.innerHTML = '<input type="text" name="name" placeholder="Select Survey:"></input>';
cell2.innerHTML = '<input type="text" name="email" placeholder="Select User:"></input>';
cell3.innerHTML = '<button type="button" onclick="removeRow(this)">Remove</button>';
}
function removeRow(button) {
var row = button.parentNode.parentNode;
row.parentNode.removeChild(row);
}
</script>
</head>
<body>
<h1>Send Risk Assessment Surveys !!</h1>
<table id="dynamicTable" border="1">
<thead>
<tr>
<td style="width:20%"><g:form_label>Select Survey:</g:form_label></td>
<td style="width:40%"><g:ui_reference name="user_ref" id="user_ref" query="metric_type.evaluation_method=assessment" table="asmt_metric"/></td>
<td style="width:20%">
<g:form_label>
Select User:
</g:form_label>
</td>
<td style="width:40%">
<g:ui_reference name="survey_ref" id="survey_ref" query="user_nameSTARTSWITHa" table="sys_user" />
</td>
</tr>
</thead>
<tbody>
<!-- Dynamic rows will be added here -->
</tbody>
</table>
<table id="dynamicTable" border="1">
<thead>
<tr>
<td style="width:20%"><g:form_label>Select Survey:</g:form_label></td>
<td style="width:40%"><g:ui_reference name="user_ref" id="user_ref" query="metric_type.evaluation_method=assessment" table="asmt_metric"/></td>
<td style="width:20%">
<g:form_label>
Select User:
</g:form_label>
</td>
<td style="width:40%">
<g:ui_reference name="survey_ref" id="survey_ref" query="user_nameSTARTSWITHa" table="sys_user" />
</td>
</tr>
</thead>
<tbody>
<!-- Dynamic rows will be added here -->
</tbody>
</table>
<button type="button" onclick="addRow()">Add Row</button>
</body>
</html>
I want to be able to ADD row by row with user and metric, but it does not work for me:
Something wrong with innerHTML
cell1.innerHTML = '<input type="text" name="name" placeholder="Select Survey:"></input>';
cell2.innerHTML = '<input type="text" name="email" placeholder="Select User:"></input>';
cell3.innerHTML = '<button type="button" onclick="removeRow(this)">Remove</button>';
Please advise.
Thx
