Buenas amigos, les quiero consultar lo siguiente:
Tengo un formulario de contacto con una función provista de un botón para agregar campos de texto.
Al necesitar que solo se puedan agregar 9 campos al que viene por defecto, necesité un JS para poder hacer el cálculo.
El problema es que no funciona en internet explorer y la mayoría de los usuarios de este form lo tienen.
Paso los códigos:
El boton en HTML:
Código HTML:
<div id="p_pub">
<h1><p>Productos a publicar:</p></h1>
<fieldset id="fiel"><input name="newsprod" type="text" id="newsprod1" placeholder="Código, especificaciones, part number." required="required"/>
<!--Este es el botón para crear el campo, en el JS también se incluye un botón para poder borrar el input creado-->
<input type="button" id="otro" value="Otro" onclick="crear(this)" />
<input name="cantprod" type="hidden" value="1" id="cantprod" />
<p> </p>
<h2>Hasta 10 productos, los 9 campos restantes <strong>no son obligatorios</strong>.</h2>
</fieldset>
</div>
El Script
Código:
num=item=0;
function crear(obj) {
num++;
if(item<9){
item++;
fi = document.getElementById('fiel'); // 1
contenedor = document.createElement('div'); // 2
contenedor.id = 'div'+num; // 3
fi.appendChild(contenedor); // 4
fi.insertBefore(contenedor,obj); // 4
ele = document.createElement('input'); // 5
ele.id = 'newsprod1';
ele.type = 'text'; // 6
ele.name = 'fil'+num; // 6
ele.placeholder = 'C\u00F3digo, especificaciones, part number'; // 6
contenedor.appendChild(ele); // 7
ele = document.createElement('input'); // 5
ele.id = 'borrar';
ele.type = 'button'; // 6
ele.value = 'Borrar'; // 8
ele.name = 'div'+num; // 8
ele.placeholder = 'C\u00F3digo, especificaciones, part number'; // 6
ele.onclick = function () {borrar(this.name); if(item==9)$("#otro").removeClass("displaynone"); item--; $('#cantprod').attr("value", item+1);} // 9
contenedor.appendChild(ele); // 7
if(item==9){
$("#otro").addClass("displaynone");
}
$('#cantprod').attr("value", item+1);
}
}
function borrar(obj) {
fi = document.getElementById('fiel'); // 1
fi.removeChild(document.getElementById(obj)); // 10
}
¡Desde ya, Muchas gracias por leer! Espero ansioso sus comentarios.
Saludos-