PHP - multiple forms, get values from both upon submit?

Question

I am a little stuck at the moment and could use some help please.

I have a calendar which is being used by multiple departments to enter their schedule in. Each user is asked to complete 1x select and 2x input fields which are divided into FORM 1 and FORM 2

FORM 1:

department code (onclick submit event)

FORM 2:

name
date
submit button

After the user has selected his/her department code, the calendar will refresh and fetch the entries for this specific department only (meaning it will filter all records for the department code). After that, the user has to enter his username and select a date, followed by pressing the submit button (form 2).

Now, the problem is that in order for FORM 2 to submit correctly, I need to know the department code from Form 1. Additionally, I am having troubles preventing the calendar from refreshing (Form 1) when pressing the submit button for Form 2.

In short, how can I clearly distinguish the ($_POST) between form 1 and form 2, while accessing both form's data?

PHP

<?php
// SHOULD BE EXECUTED AFTER THE SUBMIT BUTTON WAS CLICKED
if ($_SERVER['REQUEST_METHOD'] == 'POST' && isset($_POST['type']) && ($_POST['type']=='new_entry')) {

    // include connection details
    include '../../plugins/MySQL/connect_db.php';

    // Open a new connection to the MySQL server
    $con = new mysqli($dbhost,$dbuser,$dbpass,$dbname);

    // Output any connection error
    if ($con->connect_error) {
        die('Error : ('. $con->connect_errno .') '. $con->connect_error);
    }

    // define variables
    $table = 'calendar';
    $type = mysqli_real_escape_string($con,$_POST['type']);
    $holidex = mysqli_real_escape_string($con,$_POST['holidex']);

    if($type == 'new_entry')
    {               
        // define variables and query
        $mod_property = mysqli_real_escape_string($con,$_POST['holidex']);
        $mod_name = mysqli_real_escape_string($con,$_POST['mod_name']);
        $mod_date = date('Y-m-d',strtotime($_POST['mod_date']));

        $sql = "INSERT INTO calendar (`title`, `startdate`, `enddate`, `allDay`, `color`, `holidex`) VALUES ('$mod_name','$mod_date','$mod_date','true','','$mod_property')";

        print($sql);

        $result = $con->query($sql) or die('<p>Could not submit new MOD record into database: ' . MYSQLI_ERROR() . '</p>');

        $result->free();
    }

    $con->close();
}
?>



        <form name="form1" action="<?php echo $_SERVER['PHP_SELF']; ?>" method="POST">
        <!-- <form name="mod_form" action="../../plugins/MySQL/ajax_action.php?type=new_entry" method="POST"> -->

          <!-- Property -->
          <div class="col-md-4">
            <label>Property</label>
            <div class="input-group">
                <span class="input-group-addon"><i class="fa fa-server"></i></span>
                <select name="holidex" id="holidex" class="form-control select2" style="width: 100%;" data-placeholder="Select your property" onchange="this.form.submit();" method="POST" <?php if($_SESSION['Access']=='User') { echo "disabled"; } ?>>

                    // get all my departments and their respective codes
                    <option value="1">Dept. 1</option>
                    <option value="2">Dept. 2</option>
                    <option value="3">Dept. 3</option>

                </select>
            </div>
            <!-- /btn-group -->
          </div>
          <!-- /.property -->

        </form>

        <form name="form2" action="<?php echo $_SERVER['PHP_SELF']; ?>" method="POST">
          <!-- MOD Name -->
          <div class="col-md-4">
            <label>MOD Name</label>
            <div class="input-group">
                <span class="input-group-addon"><i class="fa fa-user"></i></span>
                <select name="mod_name" id="mod_name" class="form-control select2" style="width: 100%;" data-placeholder="Select a name">
                    <option value=""></option>
                    <option value="1">User1</option>
                    <option value="2">User2</option>
                    <option value="3">User3</option>
                </select>
            </div>
            <!-- /.input-group -->
          </div>
          <!-- /.mod name -->

          <!-- MOD Date -->
          <div class="col-md-3">
            <label>MOD Date</label>
            <div class="input-group">
              <span class="input-group-addon"><i class="fa fa-server"></i></span>
              <input type="date" class="form-control" name="daterangepicker" id="daterangepicker" />
              <!-- <input type="date" id="mod_date" name="mod_date" class="form-control" style="width: 100%;"> -->
            </div>
          </div>
          <!-- /.mod date -->

            // hidden input field to determine the type and help differentiate the $_POST submissions
            <input type="hidden" class="form-control" name="type" id="type" value="new_entry"/>

          <!-- Submit button -->
          <div class="col-md-1 text-center">
            <label>&nbsp;</label>
            <button type="submit" name="btnSubmit" class="btn btn-primary btn-block" onclick="this.disabled=true; this.value = 'Wait...'; this.form.submit(); return true;">Submit</button>
          </div>
          <!-- /.submit button -->

        </form>
        <!-- /.form 2 -->

I would use javascript to send the form so that you can add extra data. Or create a hidden field in form 2 with javascript with the department code — Sitethief
– Sitethief, Commented Nov 29, 2016 at 9:35
My JS sucks, but you mean something along the lines of creating a hidden JS field in form 2, and upon change of the dept code field in form1, update the hidden field with the input value, correct? — Armitage2k
– Armitage2k, Commented Nov 29, 2016 at 9:44
@Sitethief updated my question, followed your suggestion. works like a charm. thanks mate. — Armitage2k
– Armitage2k, Commented Nov 29, 2016 at 10:17

Armitage2k · Accepted Answer · 2016-11-29 10:16:30Z

Following SiteThief's suggestion, I am skipping the <form> approach altogether and am submitting the results via AJAX to my php handler file. Works like a charm without the pesky form submission problems.

JS

<script>
    // SAVE NEW DEPARTMENT RECORD - SAVE BUTTON
    $("#SubmitButton").click(function() {

        // check that input fields are not empty
        if($("#holidex").val()!="" && $("#mod_name").val()!="" && $("#mod_date").val()!="") {

            $.ajax({
                url: "../../plugins/MySQL/ajax_action.php",
                type: "POST",
                async: true, 
                data: { action:"mod_calendar",type:"new_entry",holidex:$("#holidex").val(),mod_name:$("#mod_name").val(),mod_date:$("#mod_date").val()},
                dataType: "html",           

                success: function(data) {
                    $('#mod_output').html(data); 
                    drawVisualization();
                },  
            });
        } else {
            //notify the user they need to enter data
            alert("Please choose a hotel, staff name and MOD date from the list.");
            return;
        }

        // close modal and refresh page
        setTimeout(function(){location.reload()}, 1000);
        return;
    });
</script>

Collectives™ on Stack Overflow

PHP - multiple forms, get values from both upon submit?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related