How to display the value of a variable in a modal bootstrap with PHP?

0

I have form that does a calculation, inserts in the bank and returns the value through a alert .

I would like to replace this message with alert with a modal .

HTML

<form method="post" action="#">
<input type="hidden" name="acao" id="acao" value="cadastrar"/>

<input type="text" name="alt" id="altura" required><br><br>
<input type="text" name="peso" id="peso" required><br><br>

PHP

function calcularIMC($altura,$peso){
 $imc = 0;
   if($altura >0 && $peso >0){
     $imc = $peso / ($altura * $altura);
   }

 echo '<script>';
 echo 'alert("'.$imc.'");';
 echo '</script>';
}

I tried to do this: - I added the code php after the </html> tag; - I added the variable responsible for the calculation: $imc ; - Linke the Enviar button with modal .

  <form method="post" action="#">
    <input type="hidden" name="acao" id="acao" value="cadastrar"/>

    <input type="text" name="alt" id="altura" required><br><br>
    <input type="text" name="peso" id="peso" required><br><br>
    <button type="submit" id="Enviar" data-toggle="modal" data-target="#myModal">Enviar</button>
 </form>

        <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
      <div class="modal-dialog" role="document">
        <div class="modal-content">
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
            <h4 class="modal-title" id="myModalLabel">Modal title</h4>
          </div>
          <div class="modal-body">
           <?php echo'.$imc.';?>
          </div>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            <button type="button" class="btn btn-primary">Save changes</button>
          </div>
        </div>
      </div>
    </div>
   </body>
 </html>

PHP

<?php
      function calcularIMC($altura,$peso){
    $imc = 0;
    if($altura >0 && $peso >0){
        $imc = $peso / ($altura * $altura);
     }   
    return $imc;
    }
 ?>

With this, when I click the Enviar (with all empty fields) button, it opens the modal and displays the '.$imc.' as String. When I enter the data and click on the Enviar button the window becomes opaque (start of the modal effect) and quickly returns to normal. I believe that modal is being called, but in some places it buga and date.

How can I resolve this?

    
asked by anonymous 19.04.2016 / 15:52

3 answers

0
         Contact Us |     Submit  
    <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="myModalLabel">Modal title</h4>
      </div>
      <div class="modal-body">
       <?php
      $text=$_REQUEST['$imc'];
      echo $text;?>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary">Save changes</button>
      </div>
    </div>
  </div>
</div>

 

    
19.04.2016 / 17:23
0

test.php :

<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
        <title>Example</title>
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
        <script src="https://code.jquery.com/jquery-2.2.4.min.js"integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44=" crossorigin="anonymous"></script>
        <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
        <script>
            $(function () {
                //Comportamento do botao de envio
                $('#submit').click(function () {submit();});
                //Alteracao do comportamento do formulario de envio
                $("#form").submit(function (e) {e.preventDefault();});
            });
            //Funcao que faz o request
            function submit() {
                //Envia um request POST
                $.post(
                    $("#form").attr("action"),//Captura a action do FORM
                    $("#form").serialize(),//Captura os dados do FORM
                    //Captura a resposta do PHP
                    function (resp) {
                        //Passa a resposta pro corpo do MODAL
                        $('#modal-body').html(resp);
                        //Mostra o MODAL
                        $('#myModal').modal('show');
                    }
                );
            }
        </script>     
    </head>
    <body>
        <nav class="navbar"></nav>
        <div class="container">
            <div class="col-lg-5">
                <form action="testing.resp.php" id="form">
                    <input type="hidden" name="acao" id="acao" value="cadastrar"/>
                    <input type="text" name="altura" id="altura" value="1.75" required><br><br>
                    <input type="text" name="peso" id="peso" value="86" required><br><br>
                    <button class="btn btn-primary" type="button" id="submit">Enviar</button>
                </form>
            </div>
            <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
                <div class="modal-dialog" role="document">
                    <div class="modal-content">
                        <div class="modal-header">
                            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                            <h4 class="modal-title" id="myModalLabel">Resultado do c&aacute;lculo</h4>
                        </div>
                        <div class="modal-body alert alert-success" id="modal-body"></div>
                        <div class="modal-footer">
                            <button type="button" class="btn btn-primary" data-dismiss="modal">Close</button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </body>
</html>

test.resp.php :

<?php

if($_POST['altura']){$altura = $_POST['altura'];} else {$altura = NULL;}
if($_POST['peso']){$peso = $_POST['peso'];} else {$peso = NULL;}

function calcularIMC($altura, $peso) {
    $imc = 0;
    if ($altura > 0 && $peso > 0) {
        $imc = $peso / ($altura * $altura);
    }
    return $imc;
}

# Fazer inclusao dos dados no banco aqui

echo calcularIMC($altura, $peso);
    
28.01.2017 / 13:10
0

Simple quotes do not accept variables:

 <?php echo'.$imc.';?>

You've made a mess because of this:

 echo 'alert("'.$imc.'");';

In fact simple quotes there are "concatenating" only, I think what you want is this:

<form method="post" action="#">
    <input type="hidden" name="acao" id="acao" value="cadastrar"/>

    <input type="text" name="alt" id="altura" required><br><br>
    <input type="text" name="peso" id="peso" required><br><br>
    <button type="submit" id="Enviar" data-toggle="modal" data-target="#myModal">Enviar</button>
</form>

<?php

function calcularIMC($altura,$peso){
 $imc = 0;
   if($altura >0 && $peso >0){
     $imc = $peso / ($altura * $altura);
   }

   return $imc;
}
?>

<!-- esta if verifica se veio do POST com isset -->
<?php if (isset($_POST['altura'], $_POST['peso'])): ?>

<?php
//Calcula IMC e adiciona a variavel
$imc = calcularIMC($_POST['altura'], $_POST['peso']);
?>

    <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="myModalLabel">Modal title</h4>
      </div>
      <div class="modal-body">
       <?php echo $imc;?>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary">Save changes</button>
      </div>
    </div>
  </div>
</div>

<!-- encerra a IF -->
<?php endif; ?>
    
23.10.2017 / 16:41