将POST从一个页面传递到另一个页面，并在前一个页面中打印数据

Question

I have 2 files: basic.php and pptimeline.php. The first holds the interface the second one is the file that gets the data from database and it is supposed to mimic a json file since I am using this on it: header('Content-Type: application/json');

I have a combo box that displays numbers of process from a database and then displays it in timeline. I managed to pass the $nprocesso from basic.php to pptimeline.php and print it there. The thing is I want to pass $nprocesso to pptimeline.php, run the database's queries and then print the data in the basic.php, but I don't know how to do it since the form action leaves me stuck in the pptimeline.php page with the printed text in json format.

I hope I made myself clear.

basic.php

<form action="json/pptimeline.php" method="POST" >
<label for="Process"> NProcess : </label>
  <select id="cproc" name="NProc"     onchange="document.getElementById('nprocesso').value=this.options[this.selectedIndex].text">
  <?php
foreach ($products as $res3)
    {
        echo "<option value='".$res3["PROCESSO"]."'>".$res3["PROCESSO"]."</option>";
    }
    ?>
</select>
<input type="hidden" name="nprocesso" id="nprocesso" value="" />
<input type="submit" name="search" value="Search"/>
</form>

 <?php
if(isset($_POST['search']))
{
    $nprocValue = $_POST['Proc'];
    $nproc = $_POST['nprocesso']; // get the selected text
}
?>

pptimeline.php

if (isset ($_REQUEST['nprocesso'])) {
$nprocesso = $_REQUEST['nprocesso'];
echo $nprocesso;
}

Answer 1

One way of doing it would be to use add header('Location: $new_url'); to redirect your pptimeline.php back to basic.php:

if (isset ($_REQUEST['nprocesso'])) {
    $nprocesso = $_REQUEST['nprocesso'];
    echo $nprocesso;
    header('Location: basic.php?v=$nprocesso'); 
}

And in basic.php add the following at the end:

if (isset($_GET['v']))
{
    echo $_GET['v']; 
}

MOREOVER

The solution provided above does the trick, but is far from the optimal way.

What you are looking for is making AJAX requests from basic.php to pptimeline.php and getting the results back to display on basic.php.

There is too much to cover, and code to change to tell you exactly how to do it. But I'll try to summarise:

1. Include Jquery in basic.php
2. Remove <form></form> surrounding your <select></select>, instead add an event handler to click events
3. In the click handler, get the value selected by the user
4. Make a AJAX request inside the click handler and send (via POST) the value

In pptimeline.php:

1. if (isset ($_POST['v'])) instead of $_REQUEST[]
2. remove the header() function, instead just echo the data you want to be sent back to the basic.php.
3. Don't forget to keep header('Content-Type: application/json') if you want the data in JSON

A AJAX post skeleton:

    $("#form1").on('click', function(){

    // get the selected value from <select>
    //var value = ....
    $.ajax()
    {
        url: "pptimeline.php",
        type: "POST",
        data: {"v" : value}
        success: function(response) {
            // some code to neatly display the results 
        }, 
        error: function(x,y,z){
            alert("an error occured"); 
        }
    }); 

Detailed Code

basic.php

I replaced the option values in the <select></select> with an indexed value for simplicity.

    <label for="Process"> NProcess : </label>
    <select id="cproc" name="NProc"     onchange="document.getElementById('nprocesso').value=this.options[this.selectedIndex].text">
        <?php
        $i = 0; 
        for ($i=0; $i < 4;$i)
        {
            echo "<option value='$i'>". $i ."</option>";
            $i++; 

        }
        ?>
    </select>
    <button id="search-button"> Search-1 </button>

    <table border="1px" id="processes-table">
        <tr>
            <th> id</th>    
            <th> title</th>
            <th> description</th>
            <th> focus_date</th>
        </tr>

    </table>
</body>


<script> 
    $("#cproc").on('change', function(){

        var v1 = $(this).val();
        $.ajax({
            url: "pptimeline.php", 
            type: "POST", 
            data: {'value' : v1}, 
            success: function(response){
                var array = JSON.parse(response); 
                var _id = array['id']; 
                var _title = array['title']; 
                var _descr = array['description']; 
                var _focus_date = array['focus_date']; 

                var string = '<tr> <td>' + _id + ' </td> <td>'+ _title +' </td><td>'+_descr + '</td><td>' + _focus_date + '</td> </tr>'; 
                $('#processes-table tr:last').after(string);

            }, 
            error: function(x,y,z){
                alert("error"); 
            }
        }); 
    }); 
</script>

pptimeline.php

if (isset ($_POST['value'])) {
    $infotimeline = array(); 

    /*
     * REPLACE this with Database fetching/quering  
     */ 
    $infotimeline['id'] = 322; 
    $infotimeline['title'] = "the lion king";
    $infotimeline['description'] = "good movie";
    $infotimeline['focus_date'] = 1990; 

    $data = json_encode($infotimeline); 
    echo $data; 
}
?>