Scrivere in una casella di testo una variabile PHP

balos

Nuovo Utente
12 Feb 2018
18
0
1
42
Ciao a tutti, sono alle primissime armi.

Vorrei fare una pagina html in cui ho tre caselle di testo, due sono di input ed una di output; ho poi un bottone submit.

Il PHP, che devo avere in un file separato, deve calcolarmi la somma dei valori inseriti nelle due caselle di testo e devo riportare il valore nella terza casella di testo (che è cioè nella pagina che ha chiamato il codice php).

La prima parte del problema la ho risolta.
Assegno il name alle caselle, le inserisco in una form a cui specifico action="nome file php" e method="POST",
nel file PHP recupero i valori inseriti con $_POST['name1'] e $_POST['name2] e li assegno alle variabili $n1 e $n2.

Creo una nuova variabile $somma=$n1+$n2 ma ora non so più come muovermi.

Devo far scrivere il valore della variabile $somma nella terza casella di testo (cioè quella con name n3). Quindi non in una nuova pagina ma nella stessa dove ho premuto il bottone submit, a fianco degli input. Ora con l'echo lo scrivo in una nuova pagina... Non capisco proprio come poterlo fare.

Il problema sopra esposto è una semplificazione del mio problema generico, nel senso che ho una pagina con molti valori di input, li voglio elaborare, e poi visualizzarli nella stessa pagina in label o caselle di testo.

Riporto il codice qui sotto

file html
HTML:
<html>
    <head>
    <p> Prova</p>
    </head>
    <body>

    <form action="calcola.php" method="POST">
        <label> n1 </label>
        <input type="text" name="n1">
        <label > n2 </label>
        <input type="text" name="n2">
        <label > n1+n2 </label>
        <input type="text" name="n3" id="n3">
        <input type="submit" value="OK" id="bottone" >
    </form>

    </body>
</html>
file calcola.php
PHP:
<?php
$na=$_POST['n1'];
$nb=$_POST['n2'];
$somma=$na+$nb;
echo($somma);
// ed ora?????
?>
Grazie mille
Marco
 

balos

Nuovo Utente
12 Feb 2018
18
0
1
42
Penso di aver risolto usando include e action="" oltre ad avere il file index.php di partenza ... questo il codice:

PHP:
<html>
    <head>
    <p> Prova</p>
    </head>
    <body>

    <form action="" method="post">
        <label> n1 </label>
        <input type="text" name="n1" id="n1">
        <label > n2 </label>
        <input type="text" name="n2" id="n2">
        <label > n1+n2 </label>
        <input type="text" name="n3" id="n3">
        <input type="submit" value="OK" id="bottone" >
    </form>

    <?php include "calcola.php"?>
   
    <script type="text/javascript">
        var na='<?php echo $na; ?>';
        var nb='<?php echo $nb; ?>';
        var somma='<?php echo $somma; ?>';

        document.getElementById("n1").value=na;
        document.getElementById("n2").value=nb;

        document.getElementById("n3").value=somma;
    </script>


    </body>
</html>
'file PHP calcola
PHP:
<?php
$na=$_POST['n1'];
$nb=$_POST['n2'];
$somma=$na+$nb;
?>
 
Ultima modifica:

macus_adi

Utente Attivo
5 Dic 2017
1.077
61
48
IT/SW
Potresti scrivere direttamente la logica sulla pagina senza inviare i dati ad una pagina php.
HTML:
<form id="send_value">
    <label>Numero Uno</label> <input type="number" id="numero_uno" name="one" min="0" max="100"><br>
    <label>Numero Due</label> <input type="number" id="numero_due" name="due" min="0" max="100"><br>
    <div id="risultato">
    </div>
    <div>
        <button id="calcola" type="button">Calcola</button>
    </div>
</form>
<script>
    $(document).ready(function(){
        var uno=$('#numero_uno');
        var due=$('#numero_due');
        var btn_calcola=$('#calcola');
        btn_calcola.on('click',function(){
            $('#risultato').html(calcola(uno.val(),due.val()));
        });
        function calcola(a,b){
            return parseInt(a)+parseInt(b);
        }
    });
</script>
 

balos

Nuovo Utente
12 Feb 2018
18
0
1
42
grazie della risposta. preferisco che il calcolo rimanga lato server.

nasce il problema però che devo riscrivere anche gli input inseriti. non c'è modo vero di non doverlo fare?

La pagina cioè è dinamica, in funzione di alcune selezioni si presenta in un modo e richiede determinati input. Devo quindi salvare sia le impostazioni che gli input.

Quale è il modo migliore per dire al server di caricare l'ultima pagina e non quella di default?
 
Ultima modifica:

macus_adi

Utente Attivo
5 Dic 2017
1.077
61
48
IT/SW
Spiega cosa dovresti fare....
Perchè devi salvare gli input????
Al server per far caricare l'ultima pagina, basta inserire se utilizza un database ORDER BY ID DESC LIMIT 1
 

balos

Nuovo Utente
12 Feb 2018
18
0
1
42
sto iniziando a studiare quindi è forse una domanda banale..

il sito e un calcolatore... richiede input in funzione di alcune scelte dell'utente. può chiedere 10 input in una impostazione scelta come 30 in un'altra.

il calcolo lo faccio eseguire lato server.

quando scrivo gli output però ricarico la pagina che deve avere già le impostazioni scelte dall'utente e deve avere gli input inseriti.

output ed input si vedono uno a fianco dell'altro.

ecco allora che per far vedere gli input e le relative impostazioni scelte quando ricarico la pagina con gli output devo forse reinserire anche gli input....

ora studio!!!
 

balos

Nuovo Utente
12 Feb 2018
18
0
1
42
Ho modificato il tutto.

La soluzione è ajax che permette di aggiornare solo una parte della pagina. In questo modo posso far calcolare a php lato srvere quanto mi serve ed inserirlo nella pagina senza dover reinserire gli input.

Ora che lo so è semplice... Prima non lo era:)

Ecco cosa ho fatto:

INDEX.HTML:
HTML:
<html>
<head>
<script type="text/javascript" src="jquery-3.3.1.js"></script>
<script type="text/javascript" src="script.js"></script>
</head>
<body>

<p><b>Inserire n1 e n2 e n3:</b></p>
<form>
n1: <input type="text" onkeyup="showHint()" id="txtn1" value="1">
n2: <input type="text" onkeyup="showHint()" id="txtn2" value="10">
n3: <input type="text" onkeyup="showHint()" id="txtn3" value="5">
</form>
<p>n1 x 10 + n2 + n3: <span id="r1"></span></p>
<p>n1 + n2 + n3: <span id="r2"></span></p>
</body>

</html>
JAVASCRIPT - FILE SCRIPT.JS:
Codice:
function showHint() {
    var input=new Array();
    input[0]=new Array();       // è la riga n.1
    input[1]=new Array();       // è la riga n.2

    var seqInput="";
    input[0][0]=document.getElementById("txtn1").id;
    input[0][1]=document.getElementById("txtn2").id;
    input[0][2]=document.getElementById("txtn3").id;
    input[1][0]=document.getElementById("txtn1").value;
    input[1][1]=document.getElementById("txtn2").value;
    input[1][2]=document.getElementById("txtn3").value;
   
    for (i=0; i<input[0].length;i++)
    {  
        seqInput=seqInput+input[0][i]+"=";
        if (i==input[0].length-1) {seqInput=seqInput+input[1][i];}
        if (i<input[0].length-1) {seqInput=seqInput+input[1][i]+"&";}
    }
    var xhr = new XMLHttpRequest();
    xhr.onreadystatechange = function()
    {
        if (xhr.status === 200)
        {
        var risultati=xhr.responseText.split("-");
        document.getElementById("r1").innerHTML = risultati[0];
        document.getElementById("r2").innerHTML = risultati[1];
        }
    };
    xhr.open("GET", "calcola.php?" + seqInput, true);
    xhr.send();
}
FILE PHP - CALCOLA
PHP:
<?php

// get the q parameter from URL
$n1 = $_GET["txtn1"];
$n2 = $_GET["txtn2"];
$n3 = $_GET["txtn3"];

// lookup all hints from array if $q is different from ""
$ra= $n1*10 + $n2 + $n3;
$rb=$n1+$n2+$n3;

// Output "no suggestion" if no hint was found or output correct values
echo $ra . "-";
echo $rb;
?>
Serve anche file jquery-3.3.1.js da inserire nella stessa cartella del file index.html.

Ciao a tutti
Marco
 

macus_adi

Utente Attivo
5 Dic 2017
1.077
61
48
IT/SW
<script> $(document).ready(function(){ var uno=$('#numero_uno'); var due=$('#numero_due'); var btn_calcola=$('#calcola'); btn_calcola.on('click',function(){ $('#risultato').html(calcola(uno.val(),due.val())); }); function calcola(a,b){ return parseInt(a)+parseInt(b); } }); </script>
alla fine potevi inserire
HTML:
$('#invia').on('click',function(){
//inviio i dati al server con ajax
var url='url';
$.ajax({
    headers:
        {
            'X-CSRF-TOKEN': cookie
        },
    url: link,
    type: type_request,
    data: {
        request:parameter
    },
    error: function (e) {
        console.log("errore chiamata", e);
    }
}).then(function(dataJSON) {
    return dataJSON;
});
});
 

balos

Nuovo Utente
12 Feb 2018
18
0
1
42
Ritieni non vada bene quanto da me scritto sopra? Quali difetti ha?

grazie
M
 

macus_adi

Utente Attivo
5 Dic 2017
1.077
61
48
IT/SW
Potresti utilizzare tranquillamente JQuery, per avere uno strato di compatibilità...
Quello che hai scritto lo faresti con 1/4 del codice con JQ... e potresti anche utilizzare lib. esterne per i calcoli senza mandare sempre al server.... sarebbe un via vai di pacchetti inutile... Ottimizzeresti la banda, eviteresti colli di bottiglia di rete....
e nel caso in cui il server va giù non te ne accorgi in quanto il codice viene eseguito sulla macchina client.