Salve a tutti! Ho un codice in javascript che duplica la prima riga di una tabella insieme ai suoi elementi. Tra questi elementi c'è una selectbox con diverse opzioni. Io vorrei che quando viene scelta un opzione venga creata una textbox nella stessa riga dove è stata scelta quell' opzione. Il codice per duplicare la riga è questo:
---------------JAVASCRIPT------------------------------
-----------------------------HTML------------------------------
---------------JAVASCRIPT------------------------------
Codice:
function addRow(tableID) {
var table = document.getElementById(tableID);
var rowCount = table.rows.length;
if(rowCount < 20){ // limit the user from creating fields more than your limits
var row = table.insertRow(rowCount);
var colCount = table.rows[0].cells.length;
for(var i=0; i<colCount; i++) {
var newcell = row.insertCell(i);
newcell.innerHTML = table.rows[0].cells[i].innerHTML;
}
}else{
alert("Si possono inserire massimo 20 righe!");
}
}
function deleteRow(tableID) {
var table = document.getElementById(tableID);
var rowCount = table.rows.length;
for(var i=0; i<rowCount; i++) {
var row = table.rows[i];
var chkbox = row.cells[0].childNodes[0];
if(null != chkbox && true == chkbox.checked) {
if(rowCount <= 1) { // limit the user from removing all the fields
alert("Non si possono cancellare tutte le righe!");
break;
}
table.deleteRow(i);
rowCount--;
i--;
}
}
}
-----------------------------HTML------------------------------
Codice:
<table id="dataTable" class="table">
<tbody>
<tr>
<td>
<input class="flat" type="checkbox" required="required" name="chk[]" checked="checked" />
</td>
<td>
<select name="scelta[]" required="required">
<option>Opzione1</option>
<option>Opzione2</option>
<option>Opzione3</option>
</select>
</td>
</tr>
</tbody>
</table>
<input type="button" value="Aggiungi Riga" onClick="addRow('dataTable')" />
<input type="button" value="Rimuovi Riga" onClick="deleteRow('dataTable')" />