1

Estou com uma atividade e estou travado nessa questão:

Crie um programa em PHP, onde o formulário possui opções de escolhas de figuras geométricas (triângulo, quadrado, retângulo e trapézio.). Assim que o usuário selecionar a figura, ele pode digitar nos campos os valores dos lados da figura e o sistema deve calcular o valor da área.

Não estou pedindo a resposta, não vejam assim, quero dicas de como elaborar esse formulário. O básico eu sei fazer, porém essa com escolha eu não sei. Se alguém puder me dizer só o termo correto que eu devo pesquisar, já será de grande valia.

<!DOCTYPE html>
<html>
<head>
	<title>Valor Area</title>
	<meta charset="utf-8">
</head>
<body>
	<form action="valorArea.php">
	<label>Escolha uma forma geométrica da lista para calcular a sua área:</label>
	<select >
		<option >Triângulo</option>
		<option >Quadrado</option>
		<option >Retângulo</option>
		<option >Trap ézio</option>
	</select>
	<br><br>
	<input type="submit" value="Calcular">
	</form>
</body>
</html>

2

2 Respostas 2

1

PHP recebe os dados via POST e faz os devidos cálculos de acordo com a estrutura condicional switch

<?php

$figura = $_POST['figura'];

switch ($figura) {
    case "triangulo":
        echo ($_POST['base']*$_POST['altura'])/2;
        break;
    case "quadrado":
        echo pow($_POST['lado'], 2);
        break;
    case "retangulo":
        echo $_POST['lado1']*$_POST['lado2'];
        break;
   case "trapesio":
        echo (($_POST['base1']+$_POST['base2'])*$_POST['haltura'])/2;
        break;
    default:
        //nada
}

?>

JavaScript - mostra os inputs de acordo com o option selecionado

<script language="javascript">
<!--
 function show(aval) {
    submeter.style.display='inline-block';
    if (aval == "triangulo") {
    hiddenDiv1.style.display='inline-block';
    } 
    else{
    hiddenDiv1.style.display='none';
    }

    if (aval == "quadrado") {
    hiddenDiv2.style.display='inline-block';
    } 
    else{
    hiddenDiv2.style.display='none';
    }

    if (aval == "retangulo") {
    hiddenDiv3.style.display='inline-block';
    } 
    else{
    hiddenDiv3.style.display='none';
    }

    if (aval == "trapesio") {
    hiddenDiv4.style.display='inline-block';
    } 
    else{
    hiddenDiv4.style.display='none';
    }
}
//-->
</script>

HTML

<form action="" method="post">
    <div class="text-center">           
    <label>Escolha uma forma geométrica da lista para calcular a sua área:</label><br>
    <select name="figura" onchange="java_script_:show(this.options[this.selectedIndex].value)">
        <option>Selecione</option>
        <option value="triangulo">Triângulo</option>
        <option value="quadrado">Quadrado</option>
        <option value="retangulo">Retângulo</option>
        <option value="trapesio">Trapézio</option>
    </select>
    </div>


    <div id="hiddenDiv1" style="display:none">
        <p>base:
        <input type="text" name="base" />
        </p>
        <p>altura:
        <input type="text" name="altura" />
        </p>
    </div>

    <div id="hiddenDiv2" style="display:none">
        <p>lado:
        <input type="text" name="lado" />
        </p>
    </div>

    <div id="hiddenDiv3" style="display:none">
        <p>Lado 1:
        <input type="text" name="lado1" />
        </p>
        <p>lado 2:
        <input type="text" name="lado2" />
        </p>
    </div>

    <div id="hiddenDiv4" style="display:none">
        <p>base 1:
        <input type="text" name="base1" />
        </p>
        <p>base 2:
        <input type="text" name="base2" />
        </p>
        <p>altura:
        <input type="text" name="haltura" />
        </p>
    </div>

    <div id="submeter" style="display:none">                
      <input type="submit" value="Calcular">
    </div>
</form>

Formulas para cálculo de areas

formulas de areas

1
  • Muito obrigado, foi de grande ajuda. 24/03/2018 às 2:13
1

Primeiro adicione valores para cada opção no seu formulário pois só assim você vai saber qual opção o usuário clicou.

<!DOCTYPE html>
<html>

<head>
  <title>Valor Area</title>
  <meta charset="utf-8">
</head>

<body>
  <form action="valorArea.php" method="GET">
    <label>Escolha uma forma geométrica da lista para calcular a sua área:</label>
    <select name="forma">
		<option value="1">Triângulo</option>
		<option value="2">Quadrado</option>
		<option value="3">Retângulo</option>
		<option value="4">Trap ézio</option>
	</select>
    <br><br>
    <input type="submit" value="Calcular">
  </form>
</body>

Após deixar o formulário assim você pode decidir entre fazer o processamento em duas etapas ou pode usar um pouco de javascript para enviar o formulário uma vez só. Se usar javascript você pode criar os campos para serem digitados os valores com evento change do select. Se quiser fazer só com php deve editar a pagina php, lá você pegara a opção com $_GET['forma'] e atribuirá a uma variável e após isso redirecionara para uma página onde o usuário possa digitar as medidas em um novo formulário, no novo formulário basta fazer o processamento utilizando a formula.

Pesquise sobre variáveis PHP, $_GET[], form action php, header("Location: "), operações PHP, PHP Básico, tratamento de variáveis, tipos de variáveis, operadores.

Se quiser deixar mais proficional pesquise sobre javascript e jquery.

Se além de programar quiser melhorar o visual utilize CSS.

1

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .