Javascript script para criação de app de uma farmacia

DanJavascript · 4 de fevereiro de 2021

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<title>farmacia</title>

</head>

<body>

<h1>Farmacia JS</h1>

<p>nome do Produto:

<input type="text" id="produto">

</p>

<p> Preço r$:

<input type="text" id="preco">

</p>

<p>

<input type="button" value="calcular Promoção" id="botpromo"></p>

<h3 id="informapromo"></h3>

<script src="farmaciaPromocao.js"></script>



</body>

</html> 





CAMADA EM JAVASCRIPT



var inproduto=document.getElementById("produto");

var inPreco=document.getElementById("preco");

//var produto2=document.getElementById(produto.value);

var preco2=Number(inPreco.value);//captura o conteudo dos campos de entrada




botpromo.addEventListener("click",Math.floor(preco2));

informapromo.textcontent="leve dois"+inproduto+ "por apenas:" +Math.floor(preco2);

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>farmacia</title>
</head>
<body>
   <h1>Farmacia JS</h1> 
   <p>nome do Produto:
       <input type="text" id="produto">
   </p>
   <p> Preço r$:
       <input type="text" id="preco">
   </p> 
   <p>
   <input type="button" value="calcular Promoção" id="botpromo"></p>
   <h3 id="informapromo"></h3>
   <script src="farmaciaPromocao.js"></script>

</body>
</html>

var inproduto=document.getElementById("produto");
var inPreco=document.getElementById("preco"); 
//var produto2=document.getElementById(produto.value);
var preco2=Number(inPreco.value);//captura o conteudo dos  campos de entrada


botpromo.addEventListener("click",Math.floor(preco2));
informapromo.textcontent="leve dois"+inproduto+ "por apenas:" +Math.floor(preco2);

OLá, estou tentando desenvolver um app que gera uma promoção na compra de dois medicamentos, a promoção

no caso seria o numero de centavos seriam descontados, mas na hora de processar os dados ele nao ta retornando nada. vou mandar aqui o codigo

quem souber o que esta errado, agradeço!! abração

CAMADA EM HTML

Rui Guilherme · 4 de fevereiro de 2021

Eu não entendi direito o problema, se é na hora de pegar os dados do Form ou se é na hora de calcular o desconto, mas pelo visto o problema é na hora de pegar os dados.

Deixa eu ver se eu entendi a regra do negocio:

Produto 1: R$ 5.49
Produto 2: R$ 5.49

Total: R$ 10.98
Total com desconto(Considerando os dois produtos): R$ 10.00

Se for o caso, acredito que a solução que você queira é essa:

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>farmacia</title>
</head>

<body>
  <h1>Farmacia JS</h1>
  <p>nome do Produto:
    <input type="text" id="produto">
  </p>
  <p> Preço r$:
    <input type="text" id="preco">
  </p>
  <button type="button" onclick="promo()" id="botpromo">calcular Promoção</button>
  <h3 id="informapromo"></h3>
</body>

<script>

function promo() {
  var inproduto = document.getElementById("produto").value;
  var inPreco = document.getElementById("preco").value;
  document.getElementById("informapromo").innerHTML =
    "leve dois " + inproduto + " por apenas: R$ " + Math.floor(inPreco);
}

</script>
</html>

Você pode ver o funcionamento aqui: https://codepen.io/ruiguilherme/pen/XWNXXwJ?editors=1010

DanJavascript · 4 de fevereiro de 2021

OBRIGADO!! é isso mesmo, eu nao estava conseguindo processar os dados corretamente, acredito q por conta do livro que estou usando como base fazer as coisas muito no passo a passo, de alguma forma, uma abordagem mais direta (como a sua) deu certo.. colocando as propriedades innerhtml direto na função. ou é claro.. eu posso ter errado alguma sintaxe. rs

Rui Guilherme · 4 de fevereiro de 2021

@DanJavascript Disponha, recomendo fortemente usar e abusar do Mozilla MDN porque ele sempre se mantém atualizado e tem uma excelente comunidade e documentação.

Exemplo: https://developer.mozilla.org/en-US/docs/Web/API/Node/textContent