No artigo anterior ensinámos como utilizar variáveis na linguagem PHP. O tutorial de hoje terá como objectivo ensinar o leitor a organizar o seu código de uma melhor forma. Imagine-se que precisa de realizar 100 operações, certamente não iria colocar todas elas no mesmo ficheiro, no mesmo código. É tão bom e simples ser organizado.

Caso tenha falhado os primeiros dois tutoriais poderá consultá-los aqui:

1. PHP: Introdução
2. PHP: Variáveis

PHP: Organização de funções e chamadas Ajax

O nosso exemplo será bastante simples e irá englobar a função de somar dois números. Para isso, o utilizador deverá criar um ficheiro chamado “soma.php” com o seguinte código:

<?php 

	$numero_1 = 10;
	
	$numero_2 = 7;
	
	echo $numero_1 + $numero_2;
	
?>

Facilmente o leitor percebe que o resultado final será 17 (10 + 7). O próximo passo será realizar a chamada deste ficheiro através do nosso “index.php”. Crie um ficheiro com o nome “index.php” com o seguinte código:

<html>
   <head>
      <title>Ola Mundo</title>
   </head>
   <body>	  
      
	  Resultado: 
	  <label id="resultado">
		<!-- Repare o leitor na chamada ao ficheiro PHP. Caso o ficheiro estivesse noutra pasta, seria 'include([CAMINHO]/soma.php)' -->
		<?php include('soma.php'); ?>
	  </label>
   </body>
</html>

Repare o leitor como foi chamada a função, com ajuda do ‘include’. Veja o resultado.

Utilizando Javascript com Ajax Requests

Imagine agora o leitor que deseja passar duas variáveis lidas do ecrã para o servidor, este iria fazer o processamento e retornar a soma desses dois valores. Como faria?

A resposta é simples e fácil, basta por exemplo, usar uma chamada Ajax. Uma chamada Ajax é um pedido que é corrido do lado do cliente e enviado ao servidor, em Javascript.

Para isso, o ficheiro ‘soma.php’ tem de estar preparado a receber duas variáveis, da seguinte forma:

<?php 

	$numero_1 = $_REQUEST['num1'];
	
	$numero_2 = $_REQUEST['num2'];
	
	echo $numero_1 + $numero_2;
	
?>

O $_REQUEST é responsável por obter os dados enviados pelo pedido ajax que estará a seguir listado.

No ficheiro index.php deverá fazer a seguinte alteração:

<html>
   <head>
      <title>Ola Mundo</title>
	  https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js
   </head>
   <body>	  
      Número 1: <input type="number" id="num1"></input>
	  Número 2: <input type="number" id="num2"></input>
	  <button onclick="SOMA();">CALCULAR SOMA</button>
	  Resultado: 
	  <label id="resultado"></label>
   </body>
</html>

<script >
function SOMA(){
	var num1 = document.getElementById('num1').value;
	var num2 = document.getElementById('num2').value;
	$.ajax({
		// GET ou POST
		type: "POST",
		// Ficheiro que queremos que faça o processamento
		url: "soma.php",
		// Repare o leitor que o que está dentro das aspas é o nome da variável que vai para o servidor
		// Para colocar mais que uma variável é necessário usar o '&' para fazer a junção
		data: "num1=" + num1 + "&num2=" + num2,
		success: function (resultado) {
			// Em caso de sucesso
			document.getElementById('resultado').innerHTML = resultado;
		},
		error: function (xhr, status, error) {
			// Em caso de erro
			document.getElementById('resultado').innerHTML = error;
		}
	});
}
</script >

Foram acrescentados dois campos para o utilizador preencher, assim como um botão para fazer o pedido que está dentro das tags <script> na função SOMA(). Os dois números são enviados para o ficheiro soma.php que irá realizar a soma e devolver o resultado (variável ‘resultado’ em caso de sucesso, ou erro).

Repare também que nas tags ‘<head>’ no inicio, foi acrescentado um script. Esse script irá permitir que o programa faça a compilação de jQuery.

Teste e veja o resultado!

Está a gostar dos tutoriais de PHP? Acha fácil, dificil? Tem alguma questão? Não hesite em comentar.