Как наследовать datalist в in input?
у меня есть форма высоких, которую я хочу добавить больше строк, чтобы добавить несколько высоких, но во время клонирования моих текстовых полей новые не создаются.
<center><input type="button" class="form-control" onClick="addRow('tablaArticulos')" value="Agregar otro artículo" style="height: 40px; font-size:20px" /> <INPUT type="button" value="Borrar fila(s)" class="form-control" style="height: 40px; font-size:20px" onClick="deleteRow('tablaArticulos')" /><br/><br/></center>
<table id="tablaArticulos" border="0" summary="Agregar" align=center width=950px cellpadding=5px>
<tr style="background-color: #F2F2F2;font-style: bold;">
<td><center><em>Selección</em></center></td>
<td><center><em>Nombre</em></center></td>
<td><center><em>Nombre del proveedor</em></center></td>
<td><center><em>Descripción</em></center></td>
<td><center><em>Num. de parte</em></center></td>
<td><center><em>Cantidad</em></center></td>
<td><center><em>Categoria</em></center></td>
<td><center><em>Ubicación</em></center></td>
<td><center><em>Responsable</em></center></td>
</tr>
<tr>
<TD><center><em><INPUT onclick="toggle(this)" type="checkboox" name="chkbox[]" title="Seleccionar todos"/></TD></em></center></TD>
<td><center><input type="text" class="form-control" id="nombre[1]" name="nombre[1]" size="25" maxlength="150" required/></center></td>
<td style="text-align: center;">
<?php
echo'<input type="text" name="marca[1]" class="form-control" list="empresas_todas">';
echo "<datalist id='empresas_todas'>";
include ('conexion.php');
$result = mysql_query ("SELECT * FROM proveedores order by nombre_proveedor asc"); //consulta de la tabla
while ($row = mysql_fetch_array ($result)){
echo "<option value='".$row['nombre_proveedor']."'>".$row['nombre_proveedor']."</option>";
}
echo "</datalist></input>";
?>
</td>
<td><center><input class="form-control" id="descripcion[1]" type="text" name="descripcion[1]" size="25" maxlength="570" required/></center></td>
<td><center><input type="text" class="form-control" id="no_parte[1]" name="no_parte[1]" size="20" maxlength="170" style="text-transform:uppercase;" onkeyup="javascript:this.value=this.value.toUpperCase();" /></center></td>
<td>
<input id="cantidad[1]" NAME="cantidad[1]" class="form-control" type="number" pattern="\d*"/ min="1" value="1">
</td>
<td>
<SELECT id="categoria[1]" name="categoria[1]" class="form-control" style="width: 117px">
<?php
include ('conexion.php');
$result = mysql_query ("SELECT * FROM categorias order by categoria asc"); //consulta de la tabla
while ($row = mysql_fetch_array ($result)){
echo "<option value='".$row['categoria']."'>".$row['categoria']."</option>";
}
?>
</SELECT>
</td>
<td><center><input class="form-control" type="text" id="ubicacion[1]" name="ubicacion[1]" size="25" maxlength="150" required/></center></td></td>
<td><center><SELECT class="form-control" id="responsable[1]" NAME="responsable[1]" style="width: 117px">
<?
include ('conexion.php');
$result = mysql_query ("SELECT * FROM responsables order by nombre asc"); //consulta de la tabla
while ($row = mysql_fetch_array ($result)){
echo "<option value='".$row['nombre']."'>".$row['nombre']."</option>";
}
?>
</SELECT></center></td>
</tr>
</table><br/>
<center> <input type="submit" class="form-control" style="height: 40px; font-size:20px" value="Guardar"/> </center>
<SCRIPT language="javascript">
function addRow(tableID) {
var table = document.getElementById(tableID);
var rowCount = table.rows.length;
var row = table.insertRow(rowCount);
var cell1 = row.insertCell(0);
var element1 = document.createElement("input");
element1.type = "checkbox";
element1.name="chkbox[]";
cell1.style="text-align: center";
cell1.appendChild(element1);
var cell2 = row.insertCell(1);
var element2 = document.getElementById("nombre[1]").cloneNode(true);
element2.class="form-control";
element2.type = "text";
element2.name = "nombre["+rowCount+"]";
element2.style="form-control";
cell2.style="text-align: center";
cell2.appendChild(element2);
var cell3=row.insertCell(2);
var element3 = document.createElement("INPUT");
element3.list="empresas_todas";
document.body.appendChild(element3);
cell3.appendChild(element3);
var cell4=row.insertCell(3);
var element4=document.getElementById("descripcion[1]").cloneNode(true);
element4.type="text";
element4.name="descripcion["+rowCount+"]";
cell4.appendChild(element4);
var cell5=row.insertCell(4);
var element5=document.getElementById("no_parte[1]").cloneNode(true);
element5.type="text";
element5.name="no_parte["+rowCount+"]";
cell5.appendChild(element5);
var cell6=row.insertCell(5);
var element6 = document.getElementById("cantidad[1]").cloneNode(true);
element6.type="SELECT";
element6.name="cantidad["+rowCount+"]";
cell6.style="text-align: center";
cell6.appendChild(element6);
var cell7=row.insertCell(6);
var element7=document.getElementById("categoria[1]").cloneNode(true);
element7.type="SELECT";
element7.name="cantidad["+rowCount+"]";
cell7.appendChild(element7);
var cell8=row.insertCell(7);
var element8=document.getElementById("ubicacion[1]").cloneNode(true);
element8.type="text";
element8.name="ubicacion["+rowCount+"]";
cell8.appendChild(element8);
var cell9=row.insertCell(8);
var element9=document.getElementById("responsable[1]").cloneNode(true);
element9.type="SELECT";
element9.name="responsable["+rowCount+"]";
cell9.appendChild(element9);
}
</SCRIPT>
мне пришло в голову создать элементы снова, но они также не отображались в новой строке: s
Спасибо!
1
Author: kenethluna, 2016-07-18
1 answers
Проблема в том, что вы назначаете атрибут list
с точечной нотацией (t3.list
), и вы должны сделать это с помощью setAttribute()
:
t3.setAttribute("list", "empresas_todas");
Как только это будет исправлено, dropdown уже правильно заполнен (вы можете увидеть это в этом JSFiddle).
1
Author: Alvaro Montoro, 2016-07-19 16:43:19