Jump to content
pedroxlima

"Interligar" duas paginas PHP

Recommended Posts

pedroxlima

Boas

Eu encontro-me a fazer um programa para uma formação que estou a frequentar e queria criar um programa que permiti-se efectuar os cálculos automaticamente.

Acontece que só "sei" C ou o básico de HTML,PHP, etc. Então comecei por criar em PHP e depois utilizar algo como PHP desktop para ficar como uma aplicação "normal".

Só que em vez de andar a saltar de pagina em pagina queria tentar utilizar só uma pagina, ou seja, do lado esquerdo inseria os dados e quando carrega-se em calcular obtinha os resultados do lado direito.

Acontece que não percebo muito de javascript e estava a pensar usar as iframes. Dará para fazer o que pretendo? Ou existe outra forma?

Neste momento estou apenas a fazer localmente,

Provavelmente poderá ter sido respondido algo parecido, mas não sei o que procurar para me guiar neste assunto.

Codigo:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<meta name="description" content="">
<meta name="author" content="">
<link rel="icon" href="../../favicon.ico">
<title>Jumbotron Template for Bootstrap</title>
<!-- Bootstrap core CSS -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="jumbotron.css" rel="stylesheet">
<!-- Just for debugging purposes. Don't actually copy these 2 lines! -->
<!--[if lt IE 9]><script src="../../assets/js/ie8-responsive-file-warning.js"></script><![endif]-->
<script src="../../assets/js/ie-emulation-modes-warning.js"></script>
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
 <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
 <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
<style>
.right {
position: absolute;
right: 0px;
width: 300px;

padding: 10px;
}
.formulario {
position: static;
left: 70px;

}
.row {
display: flex;
align-items: stretch;
justify-content: space-between;
flex-direction: row-reverse;
}
</style>
</head>
<body >


<img alt="d" class="right" src="img/fundo.png" />
<br><br><br><br><br><br><br><br>
<div class="formulario">
<div class="row">
<div class="frame">
<iframe src="resultados.html" width="800" height="400" ></iframe>
</div>
<form class="form-horizontal">
<fieldset>

<!-- Text input-->
<div class="form-group">
<label class="col-md-5 control-label" for="Fabric">Fabric Wide</label>
<div class="col-md-5">
<input id="Fabric" name="Fabric" type="text" placeholder="mm" class="form-control input-md">

</div>
</div>
<!-- Text input-->
<div class="form-group">
<label class="col-md-5 control-label" for="Spare">Spare widht</label>
<div class="col-md-5">
<input id="Spare" name="Spare" type="text" placeholder="mm" class="form-control input-md">

</div>
</div>
<!-- Text input-->
<div class="form-group">
<label class="col-md-5 control-label" for="Xres">Resolution X</label>
<div class="col-md-5">
<input id="Xres" name="Xres" type="text" placeholder="mm/pixel" class="form-control input-md">

</div>
</div>
<!-- Text input-->
<div class="form-group">
<label class="col-md-5 control-label" for="Yres">Resolution Y</label>
<div class="col-md-5">
<input id="Yres" name="Yres" type="text" placeholder="mm/pixel" class="form-control input-md">

</div>
</div>
<!-- Text input-->
<div class="form-group">
<label class="col-md-5 control-label" for="mSpeed">Fabric Max speed</label>
<div class="col-md-5">
<input id="mSpeed" name="mSpeed" type="text" placeholder="m/min" class="form-control input-md">

</div>
</div>
<!-- Select Basic -->
<div class="form-group">
<label class="col-md-5 control-label" for="selectbasic">Select System</label>
<div class="col-md-5">
<select id="selectbasic" name="selectbasic" class="form-control">
 <option value="4090">SVC 2 - 4K</option>
 <option value="8100">SVC 2 - 8K</option>
 <option value="">Ibar</option>
</select>
</div>
</div>
<!-- Button (Double) -->
<div class="form-group">
<label class="col-md-4 control-label" for="Bt1"></label>
<div class="col-md-6">
<button id="Bt1" name="Bt1" class="btn btn-success">Calculate</button>
<button id="Bt2" name="Bt2" class="btn btn-inverse">Reset</button>
</div>
</div>
</fieldset>
</form>

</div>
</div>


<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
 <hr>
 <footer>
 <p>© Company 2015</p>
 </footer>
</div> <!-- /container -->

<!-- Bootstrap core Javascript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="../../dist/js/bootstrap.min.js"></script>
<!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
<script src="../../assets/js/ie10-viewport-bug-workaround.js"></script>
</body>
</html>

Share this post


Link to post
Share on other sites
alpharroba

Boas, primeiro deves definir um method no form, aconselho-te o POST. Acrescente ao form method="POST" e no butão para calcular mete type="submit"

A seguir ao form metes:

<?php

if ($_SERVER['REQUEST_METHOD']== "POST")/

{

//codigo dos calculos aqui

}

Depois é fazeres:

echo $resultado no sitio onde queres que apareça o resultado.

Copia este codigo para uma pagina à parte e vê como funciona

<form method="POST">
Numero<input type="text" name="numero">
Multiplicador:<select name="multiplicador">
	 <option value="1">1</option>
	 <option value="2">2</option>
	 <option value="3">3</option>
</select>
<input type="submit">
</form>
<br>

<?php
$resultado="";
if ($_SERVER['REQUEST_METHOD']== "POST")
{
  $resultado=$_POST["numero"] * $_POST["multiplicador"]; 
}
?>

<div>
<?php echo $resultado;?>
</div>

Edited by alpharroba

Share this post


Link to post
Share on other sites
KTachyon

Sem iframes, tens que fazer um pedido assíncrono através de Javascript ao servidor, recebes a resposta e alteras o DOM da página para apresentar aquilo que o servidor devolve.

Alternativamente, esqueces o PHP e fazes tudo em Javascript, visto que aquilo que estás a fazer não necessita exactamente de ser executado num servidor.


“There are two ways of constructing a software design: One way is to make it so simple that there are obviously no deficiencies, and the other way is to make it so complicated that there are no obvious deficiencies. The first method is far more difficult.”

-- Tony Hoare

Share this post


Link to post
Share on other sites
pedroxlima

Olá obrigado pela ajuda, já tenho a pagina mais ou menos como pretendo.

Mas neste momento tenho os seguintes problemas:

Quando envio os dados para a linha 1 fica tudo bem, mas se enviar para a linha 2 com dados na linha 1 inserida os da 1 desaparecem.

Quando tiver a opção que pretendo, coloco o select e esses dados serão usados na parte seguinte que ainda estou a pensar como fazer.

Se só tiver uma linha de inspecção só cria uma tabela se duas cria duas.

Depois de fazer submit que o formulário fica-se com a mesma estrutura em vez de encolher.

Por favor indiquem

<head>
   <meta charset="utf-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1">
   <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
   <meta name="description" content="">
   <meta name="author" content="">
   <link rel="icon" href="../../favicon.ico">
   <title></title>
   <!-- Bootstrap core CSS -->
   <link href="css/bootstrap.min.css" rel="stylesheet" media="all">
   <!-- Custom styles for this template -->
   <link href="jumbotron.css" rel="stylesheet">

<!-- CSS para impressão -->
<link rel="stylesheet" type="text/css" href="css/print.css" media="print" />
   <!-- Just for debugging purposes. Don't actually copy these 2 lines! -->
   <!--[if lt IE 9]><script src="../../assets/js/ie8-responsive-file-warning.js"></script><![endif]-->
   <script src="../../assets/js/ie-emulation-modes-warning.js"></script>
   <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
   <!--[if lt IE 9]>
  <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
  <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
   <![endif]-->
<style>
.right {
   position: absolute;
   right: 50px;
   width: 350px;
   padding: 30px;
}
.right2 {
   padding-left: 500px;
}

.left {
   padding-left: 125px;
margin: 0px;
}
.row { 
display: flex;
flex-direction: column;
align-items: stretch; 
justify-content: center; 

}
.line { 
display: flex; 
flex-direction: row;
align-items: center; 
justify-content: space-around; 
}

</style>
 </head>
 <body >
<!-- Declaração de variaveis-->
<?php
 $fabric = 0;
 $spare = 0;
 $xres = 0;
 $yres = 0;
 $mspeed = 0;
 $lents = 0;
 $sensor = 0;
 $ncam = 0;
 $dist = 0;
 $fov = 0;
 $ov = 0;
 $alt = 0;
 $alt1 = 0;
 $alt2 = 0;
 $ov1 = 0;
 $fov1 = 0;
 $pixeis = 0;
 $pixeis1 = 0;
 $pixeis2 = 0;
 $ncam3 = 0;
 $dist1 = 0;
 $fov3 = 0;
 $ov3 = 0;
 $ncam4 = 0;
 $dist2 = 0;
 $fov4 = 0;
 $ov4 = 0;
 $line = 0;

/* Declaração do tamanho do pixel */

 $px1=10;
 $px2=5;
 $px3=3.75;

?>
<img alt="d" class="right" src="img/fundo.png"  />
<br><br><br><br><br><br><br><br>

<div class="line">
<header class="header no-print">
 <div class="row">
  <form class="form-horizontal" method="POST">
   <fieldset>
 <!-- Text input-->
 <div class="form-group">
  <label class="col-md-5 control-label" for="Fabric">Fabric Wide</label> 
  <div class="col-md-6">
   <input id="Fabric" name="Fabric" type="text" placeholder="mm" class="form-control input-md">
  </div>
 </div>
 <!-- Text input-->
 <div class="form-group">
  <label class="col-md-5 control-label" for="Spare">Spare width</label> 
  <div class="col-md-6">
   <input id="Spare" name="Spare" type="text" placeholder="mm" class="form-control input-md">
  </div>
 </div>
 <!-- Text input-->
 <div class="form-group">
  <label class="col-md-5 control-label" for="Xres">Resolution X</label> 
  <div class="col-md-6">
   <input id="Xres" name="Xres" type="text" placeholder="mm/pixel" class="form-control input-md">
  </div>
 </div>
 <!-- Text input-->
 <div class="form-group">
  <label class="col-md-5 control-label" for="Yres">Resolution Y</label> 
  <div class="col-md-6">
   <input id="Yres" name="Yres" type="text" placeholder="mm/pixel" class="form-control input-md">
  </div>
 </div>
 <!-- Text input-->
 <div class="form-group">
  <label class="col-md-5 control-label" for="mSpeed">Fabric Max speed</label> 
  <div class="col-md-6">
   <input id="mSpeed" name="Mspeed" type="text" placeholder="m/min" class="form-control input-md">
  </div>
 </div>
 <!-- Text input-->
 <div class="form-group">
  <label class="col-md-5 control-label" for="Fabric">Lenses</label> 
  <div class="col-md-6">
   <input id="lent" name="Lents" type="text" placeholder="mm" class="form-control input-md">
  </div>
 </div>
  <!-- Select Basic -->
 <div class="form-group">
  <label class="col-md-5 control-label" for="selectbasic">Select Line</label>
  <div class="col-md-6">
   <select id="selectline" name="Line" class="form-control">
   <option value="1">Line 1</option>
   <option value="2">Line 2</option>
   </select>
  </div>
 </div>
 <!-- Select Basic -->
 <div class="form-group">
  <label class="col-md-5 control-label" for="selectbasic">Select System</label>
  <div class="col-md-6">
   <select id="selectbasic" name="Sensor" class="form-control">
   <option value="4080">SVC 2 - 4K</option>
   <option value="8160">SVC 2 - 8K</option>
   </select>
  </div>
 </div>
 <!-- Button (Double) -->
 <div class="form-group">
  <label class="col-md-4 control-label" for="Bt1"></label>
  <div class="col-md-8">
   <button id="Bt1" name="Bt1" class="btn btn-primary">Calculate</button>
   <button id="Bt3" name="Bt3" class="btn btn-inverse">Reset</button>
  </div>
 </div>
 </fieldset>
 </form>
 <div class="left">
  <a href="index.php"><button id="Bt2" name="Bt2" class="btn btn-primary">Back</button></a>

 </div>
 </div>
  </header>
 <div class="frame">
  <?php
   if ($_SERVER['REQUEST_METHOD']== "POST")
   {}
  <header class="header no-print">
  <img class="right2" src="img/icn-imprimir.png" onclick="javascript:window.print();">
  </header>
  <header class="header print">
  <!-- Tabela Linha 1 -->
  <table class="table table-bordered">
   <caption> Imput </caption>
   <thead>
 <tr>
  <th class="text-center">Fabric Wide</th>
  <th class="text-center">Spare width</th>
  <th class="text-center">Resolution X</th>
  <th class="text-center">Resolution Y</th>
  <th class="text-center">Max speed</th>
  <th class="text-center">Lenses</th>
  <th class="text-center">System type</th>
 </tr>
   </thead>
   <tbody>
 <tr>
   <td class="text-center"><?php echo"$fabric" ?></td>
  <td class="text-center"><?php echo"$spare  mm"  ?></td>
  <td class="text-center"><?php echo"$xres mm/px" ?></td>
  <td class="text-center"><?php echo"$yres mm/px" ?></td>
  <td class="text-center"><?php echo"$mspeed m/min" ?></td>
  <td class="text-center"><?php echo"$lents mm" ?></td>
  <td class="text-center"><?php echo"$sensor" ?></td>
  </tr>
 </tbody>
  </table>
  <table class="table table-bordered">
   <caption> Calculation </caption>
   <thead>
 <tr>
   <th class="text-center">Cam number</th>
   <th class="text-center">Space between cam</th>
   <th class="text-center">FOV</th>
   <th class="text-center">Overlap</th>
   <th class="text-center">Height</th>
   <th class="text-center">Pixels</th>
   <th class="text-center">Selected</th>
 </tr>
   </thead>
   <tbody>
 <tr>
   <td class="text-center"><?php echo"$ncam" ?></td>
   <td class="text-center"><?php echo"$dist mm" ?></td>
   <td class="text-center"><?php echo"$fov mm" ?></td>
   <td class="text-center"><?php echo"$ov mm" ?></td>
   <td class="text-center"><?php echo"$alt mm" ?></td>
   <td class="text-center"><?php echo"$sensor" ?></td>
   <td class="text-center"><input type="radio" ></td>
  </tr>
 <tr>
   <td class="text-center"><?php echo"$ncam" ?></td>
   <td class="text-center"><?php echo"$dist mm" ?></td>
   <td class="text-center"><?php echo"$fov1 mm" ?></td>
   <td class="text-center"><?php echo"$ov1 mm" ?></td>
   <td class="text-center"><?php echo"$alt mm" ?></td>
   <td class="text-center"><?php echo"$pixeis" ?></td>
   <td class="text-center"><input type="radio" ></td>
  </tr>
  <tr>
   <td class="text-center"><?php echo"$ncam3" ?></td>
   <td class="text-center"><?php echo"$dist1 mm" ?></td>
   <td class="text-center"><?php echo"$fov3 mm" ?></td>
   <td class="text-center"><?php echo"$ov3 mm" ?></td>
   <td class="text-center"><?php echo"$alt1 mm" ?></td>
   <td class="text-center"><?php echo"$pixeis1" ?></td>
   <td class="text-center"><input type="radio" ></td>
  </tr>
   <tr>
   <td class="text-center"><?php echo"$ncam4" ?></td>
   <td class="text-center"><?php echo"$dist2 mm" ?></td>
   <td class="text-center"><?php echo"$fov4 mm" ?></td>
   <td class="text-center"><?php echo"$ov4 mm" ?></td>
   <td class="text-center"><?php echo"$alt1 mm" ?></td>
   <td class="text-center"><?php echo"$pixeis2" ?></td>
   <td class="text-center"><input type="radio" ></td>
  </tr>
 </tbody>
  </table>
  <!-- Tabela Linha 2 -->
  <table class="table table-bordered">
   <caption> Calculation </caption>
   <thead>
 <tr>
   <th class="text-center">Cam number</th>
   <th class="text-center">Space between cam</th>
   <th class="text-center">FOV</th>
   <th class="text-center">Overlap</th>
   <th class="text-center">Height</th>
   <th class="text-center">Pixels</th>
   <th class="text-center">Selected</th>
 </tr>
   </thead>
   <tbody>
 <tr>
   <td class="text-center"><?php echo"$ncam" ?></td>
   <td class="text-center"><?php echo"$dist mm" ?></td>
   <td class="text-center"><?php echo"$fov mm" ?></td>
   <td class="text-center"><?php echo"$ov mm" ?></td>
   <td class="text-center"><?php echo"$alt mm" ?></td>
   <td class="text-center"><?php echo"$sensor" ?></td>
   <td class="text-center"><input type="radio" ></td>
  </tr>
 <tr>
   <td class="text-center"><?php echo"$ncam" ?></td>
   <td class="text-center"><?php echo"$dist mm" ?></td>
   <td class="text-center"><?php echo"$fov1 mm" ?></td>
   <td class="text-center"><?php echo"$ov1 mm" ?></td>
   <td class="text-center"><?php echo"$alt mm" ?></td>
   <td class="text-center"><?php echo"$pixeis" ?></td>
   <td class="text-center"><input type="radio" ></td>
  </tr>
  <tr>
   <td class="text-center"><?php echo"$ncam3" ?></td>
   <td class="text-center"><?php echo"$dist1 mm" ?></td>
   <td class="text-center"><?php echo"$fov3 mm" ?></td>
   <td class="text-center"><?php echo"$ov3 mm" ?></td>
   <td class="text-center"><?php echo"$alt1 mm" ?></td>
   <td class="text-center"><?php echo"$pixeis1" ?></td>
   <td class="text-center"><input type="radio" ></td>
  </tr>
   <tr>
   <td class="text-center"><?php echo"$ncam4" ?></td>
   <td class="text-center"><?php echo"$dist2 mm" ?></td>
   <td class="text-center"><?php echo"$fov4 mm" ?></td>
   <td class="text-center"><?php echo"$ov4 mm" ?></td>
   <td class="text-center"><?php echo"$alt1 mm" ?></td>
   <td class="text-center"><?php echo"$pixeis2" ?></td>
   <td class="text-center"><input type="radio" ></td>
  </tr>
 </tbody>
  </table>
  </header>
 </div>
</div>



<br><br><br><br><br><br>
  <hr>
  <footer>
    <p>© Company -(2015)</p>
  </footer>
   </div> <!-- /container -->

   <!-- Bootstrap core Javascript
   ================================================== -->
   <!-- Placed at the end of the document so the pages load faster -->
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
   <script src="../../dist/js/bootstrap.min.js"></script>
   <!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
   <script src="../../assets/js/ie10-viewport-bug-workaround.js"></script>
 </body>
</html>

-me o que devo procurar para continuar o meu projecto.

Share this post


Link to post
Share on other sites
pedroxlima

Olá,

Uma vez que ninguém deu uma ideia sobre uma resolução, volto a perguntar.

Neste momento tenho o mesmo problema.

Se alguém me puder dar uma ideia de como o resolver agradecia.

Aqui está o código: http://jsfiddle.net/akjs061o/

Obrigado.

Share this post


Link to post
Share on other sites
HappyHippyHippo

Ninguém deu uma ideia?

Leste bem todo o topico?

Olha bem a resposta do @KTachyon


IRC : sim, é algo que ainda existe >> #p@p

Share this post


Link to post
Share on other sites
pedroxlima

Ninguém deu uma ideia?

Leste bem todo o topico?

Olha bem a resposta do @KTachyon

Antes de mais obrigado pela resposta. Eu refiro-me ao post seguinte a essa resposta, se alguém vir não tenho recurso a iframes.

Estou com um problema e não sei como o resolver, por isso pedi ajuda e como não sei javascript e sei alguma coisa de php estou a tentar fazer na linguagem que vou conhecendo.

Share this post


Link to post
Share on other sites
HappyHippyHippo

Antes de mais obrigado pela resposta. Eu refiro-me ao post seguinte a essa resposta

eu li essa entrada, no entanto, não dá para perceber nada do que escreveste.

"linha 1", "linha 2", "select", ... não consegues explicar exactamente o que estás a fazer ?


IRC : sim, é algo que ainda existe >> #p@p

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

×
×
  • Create New...

Important Information

By using this site you accept our Terms of Use and Privacy Policy. We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.