0

Tengo problemas al intentar llamar una función de JavaScript para que me despliegue dos input dinámicos en html.

Cuando presiono mi botón con onclick="add_fields" la consola me dice que no encuentra la función y no despliega nada. Debería desplegar un input para ingresar un número y un dropdown que contiene opciones que extraigo desde mi base de datos.

La función es correcta ya que si creo los campos de manera estática si funciona, el problema es al hacerlo dinámico.

<div id="criterios_fields"></div>

<div class="form-group">
    <input onclick="add_fields()" class="btn btn-success"  type="button" id="more_fields"  value="Añadir material">
</div>


<script type="text/javascript">

var cename = 0;

function add_fields() {
    cename++; 
    var objTo = document.getElementById('criterios_fields')
    var divtest = document.createElement("div")
    divtest.innerHTML = '<div class="form-group"><label class="control-label">' + cename +':&nbsp;</label><label class="control-label" for="cantidad">Cantidad:</label><span> <input class="form-control" type="number" style="width:60px;" name="cantidades[]" <id="cantidad" value="" min="1"/></span><br><label class="control-label" for="maaterial">&nbsp;Material:</label><span><select style="width: 100%" rel="select2" name="materiales[]" id="material_id" class="form-control select2"> <option value="">Escoge Material</option> @foreach($materiales as $material) <option value="{{$material->id}}">{{$material->descripcion}} {{$material->codigo}} {{$material->unidad}}</option> @endforeach  </select><br>';
    divtest.innerHTML+='</div><hr><br>';
    objTo.append(divtest)

}
</script>

boton que activa la accion: este al presionarlo no reconoce la funcion de add_fields

Formulario que quiero que despliegue

Nuevo colaborador
osvaldo farfan es un usuario nuevo en el sitio. Tenlo en cuenta cuando preguntes por aclaraciones, comentes o respondas. Revisa nuestro Código de conducta.
1

0

Tu Respuesta

osvaldo farfan es un nuevo usuario. Sé cortés y por favor lee nuestro Código de conducta.

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Examina otras preguntas con la etiqueta o formula tu propia pregunta.