0

soy nuevo en javascript, tengo una función que se ejecuta desde un boton en el front . Esta función calcular toma los valores de los input, verifica con el if si esos valores existen y luego hace un calculo y los pinta en el front, hasta ahí voy bien, luego una ves pintados los resultados hago aparecer un boton PDF, la idea es que pueda hacer click en ese boton y se genere un pdf con los datos .

los problemas: No puedo llamar a la función generarPdf desde un botón ya que por lo poco que entiendo se encuentra dentro de la función calcular.

no puedo poner la función generarPdf a fuera porque las variables están declaradas en la función calcular.

si hago las variables globales cuando hago click en calcular están vacías .

quien me da una mano para aprender un poco la lógica que debo usar ? . Gracias de ante mano

    function calcular() {

    var costoMaterial = document.getElementById("costoMaterial").value;
    var valorHora = document.getElementById("valorHora").value;
    var tiempoImpresion = document.getElementById("tiempoImpresion").value;
    var cantidadMaterial = document.getElementById("cantidadMaterial").value;

    if(costoMaterial == null || costoMaterial.length == 0){
                alert("Ingrese el costo de 1KG de Material")
            }
            
            if(valorHora == null || valorHora.length == 0) {
                alert("Ingrese el Valor Hora")
            }
        
            if(tiempoImpresion == null || tiempoImpresion.length == 0) {
                alert("Ingrese el tiempo de Impresión")
            }
        
            if(cantidadMaterial == null || cantidadMaterial.length == 0) {
                alert("Ingrese la cantidad de Material")
            }
        
            else {

                var precioImpresion = valorHora * tiempoImpresion;
                var precioMaterial = costoMaterial / 1000 * cantidadMaterial;
                var resultado = precioImpresion + precioMaterial;
        
                document.getElementById("material").innerHTML =`$ ` + precioMaterial.toFixed(2);
                document.getElementById("impresion").innerHTML = `$ ` + precioImpresion.toFixed(2);
                document.getElementById("total").innerHTML = `$ ` + resultado.toFixed(2);
        
                console.log(precioImpresion)
                console.log(precioMaterial)
                console.log(resultado)
        
                $('#pdf').removeClass("d-none");


                function generarPdf() {
                
                    var doc = new jsPDF()
                
                    doc.text(`precio ${resultado}`,12,12)
                    doc.save("cotizacion.pdf")

                }
                
            }

}
    <div class="col-lg-12 d-flex mt-4">
              <button type="button" class="btn btn-light" onclick="calcular()">CALCULAR</button>
              <button type="button" class="btn btn-light ml-4 d-none" id="pdf" onclick="generarPdf()">PFD</button>
            </div>

3
  • Puedes subir tu html, donde tienes tus botones el 5 oct. 2020 a las 23:57
  • El código html es muy simple, tiene los input y los 2 botones nada mas. el 6 oct. 2020 a las 0:27
  • Hola. Si puedes definir la funcion generarPdf() fuera del método pasándole los parámetros que necesita así: generarPdf(resultado){ //tu código } y la invocas desde el método del evento luego de validar. Si necesita otros parámetros los pones en su signatura.
    – quevedo
    el 6 oct. 2020 a las 0:53

1 respuesta 1

0
   <div class="col-lg-12 d-flex mt-4">
    <button type="button" class="btn btn-light" onclick="calcular()">CALCULAR</button>
    <button type="button" class="btn btn-light ml-4 d-none" id="pdf" onclick="generarPdf()">PFD</button>
</div>
<script>
    function calcular() {
        alert('calcular');
        var costoMaterial = document.getElementById("costoMaterial").value;
        var valorHora = document.getElementById("valorHora").value;
        var tiempoImpresion = document.getElementById("tiempoImpresion").value;
        var cantidadMaterial = document.getElementById("cantidadMaterial").value;

        if (costoMaterial == null || costoMaterial.length == 0) {
            alert("Ingrese el costo de 1KG de Material")
        }

        if (valorHora == null || valorHora.length == 0) {
            alert("Ingrese el Valor Hora")
        }

        if (tiempoImpresion == null || tiempoImpresion.length == 0) {
            alert("Ingrese el tiempo de Impresión")
        }

        if (cantidadMaterial == null || cantidadMaterial.length == 0) {
            alert("Ingrese la cantidad de Material")
        } else {

            var precioImpresion = valorHora * tiempoImpresion;
            var precioMaterial = costoMaterial / 1000 * cantidadMaterial;
            var resultado = precioImpresion + precioMaterial;

            document.getElementById("material").innerHTML = `$ ` + precioMaterial.toFixed(2);
            document.getElementById("impresion").innerHTML = `$ ` + precioImpresion.toFixed(2);
            document.getElementById("total").innerHTML = `$ ` + resultado.toFixed(2);

            console.log(precioImpresion)
            console.log(precioMaterial)
            console.log(resultado)

            $('#pdf').removeClass("d-none");


            return resultado;

        }
    }

    function generarPdf() {
        resultado = calcular();
        alert('pdf');
        var doc = new jsPDF()

        doc.text(`precio ${resultado}`, 12, 12)
        doc.save("cotizacion.pdf")

    }
</script>

Una respuesta en función del comentario de quevedo.

2
  • El problema ahí es que la función generarPdf se ejecuta sola, necesito llamar a esa función desde el botón PDF el 6 oct. 2020 a las 5:53
  • acabo de actualizar la respuesta.
    – Jorge
    el 7 oct. 2020 a las 13:07

Tu Respuesta

Al pulsar en “Publica tu respuesta”, muestras tu consentimiento a nuestros términos de servicio, política de privacidad y política de cookies

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.