同一页面上的多个PHP提交保留所有数据

Question

I am currently trying to create a website for my church in which we can select songs for the songlist each week. We choose 6 songs and I am wanting to set up multiple forms one one page to allow different criteria to be selected and each song to be pulled individually and then I will create a master submit at the bottom which will pull the data from all 6 forms to generate the final data.

Below is sample data of just entering a song and artist on a 2 form test, but the problem is when I submit 1, the other one empties. I need all the data to stay so that once all 6 are filled in the master submit can grab all the data that has been posted. Please shed any insight you can.

<?PHP           
        $Artist1 = $Song1 ="";  
    if (($_SERVER["REQUEST_METHOD"] == "POST") and isset($_POST["submit1"]) )
    {   
         if (empty($_POST["Artist1"]))
         {
            $Artist1 = "";
         } else 
         {
            $Artist1 = test_input($_POST["Artist1"]);
         }

         if (empty($_POST["Song1"]))
         {
            $Song1 = "";
         } else 
         {
            $Song1 = test_input($_POST["Song1"]);
         }           
    }
        ?>
        <form method="post" action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]);?>">
            Artist: <input type="text" name = "Artist1" value="<?php echo $Artist1;?>">
            <br>
            Song: <input type="text" name = "Song1" value="<?php echo $Song1;?>">
            <br>
            <input type = "submit" name = "submit1" value="Submit1">
        </form>

        <?php

        echo "<h2>Your song </h2>";
        echo $Artist1;
        echo "<br>";
        echo $Song1;        
        ?>
<?PHP

        $Artist2 = $Song2 ="";
    if (($_SERVER["REQUEST_METHOD"] == "POST") and isset($_POST["submit2"]) )
    {   
         if (empty($_POST["Artist2"]))
         {
            $Artist2 = "";
         } else 
         {
            $Artist2 = test_input($_POST["Artist2"]);
         }

         if (empty($_POST["Song2"]))
         {
            $Song2 = "";
         } else 
         {
            $Song2 = test_input($_POST["Song2"]);
         }       
    }
        ?>
        <form method="post" action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]);?>">
            Artist: <input type="text" name = "Artist2" value="<?php echo $Artist2;?>">
            <br>
            Song: <input type="text" name = "Song2" value="<?php echo $Song2;?>">
            <br>
            <input type = "submit" name = "submit2" value="Submit2">
        </form>

        <?php

        echo "<h2>Your song </h2>";
        echo $Artist2;
        echo "<br>";
        echo $Song2;

        function test_input($data) {
        $data = trim($data);
        $data = stripslashes($data);
        $data = htmlspecialchars($data);
        return $data;
        }

        ?>

Answer 1

In HTML if you have a form with an action property when you click on submit the browser will do a POST to the action webpage you set. There it's no way to do what you need in that way.

You have three solutions:

1. Join all the forms in a single form
2. Use iframes, on each iframe you should have one form for one song.
3. Use Ajax to send songs when the user press the button on each song form like this way