Home » Php » javascript – PHP: POST 3 Select Option data to another php page and display

javascript – PHP: POST 3 Select Option data to another php page and display

Posted by: admin February 25, 2020 Leave a comment

Questions:

I’m Peter. I’m still new in php. I want to ask about the required fields. Which means, user, must complete all input before submit.

In my case, I have 3 select option and the user must select all three options before press button search. If one of them is empty, than it will popup an error. Below is the description of those select option

1) The first select option is to select team, this data is populated from MySQL.

2) The second select option is Time from. This time if select from datetime picker

3) The thirdselect option is Time to. This time if select from datetime picker

And for now, event I only complete on select option, it still can redirect to next page. Below is my current code

dashboard.php

<?php
    require_once "../../../config/configPDO.php";
    require_once "../../../config/check.php";
    $email = $_SESSION['login_user'];
    $team = $_SESSION['team'];
    $team_n = $_SESSION['team_n'];

    $smt = $conn->prepare("SELECT * FROM ot_team INNER JOIN ot_users ON ot_team.team_id = ot_users.team_id WHERE ot_users.roles_id = 7 AND ot_users.team_id <> 1 ORDER BY ot_users.fullname ASC");
    $smt->execute();
    $data = $smt->fetchAll();

?>

<form method = 'post' action = 'display.php'>
  <td width="40%">
    <select class="form-control"  name="team" id="team">
      <option value="">Please select...</option>
      <?php foreach ($data as $row2): ?>
      <option value= <?php echo $row2["team_id"]; ?>><?php echo $row2["fullname"]; ?></option>
      <?php endforeach ?>
    </select>

  <td width="1%"></td>
  </td>
  <td width="20%"><input type="text" name="from" id="from" class="form-control" placeholder="From" ></td>
  <td width="1%"></td>
  <td width="20%"><input type="text" name="to" id="to" class="form-control" placeholder="To" ></td>
  <td width="1%"></td>
  <td width="10%"><button type="submit" value="Search" class="btn btn-primary">Send</button><td>
  </form>

<script>
$(document).ready(function(){
  $.datepicker.setDefaults({
    dateFormat: 'yy-mm-dd'
  });
  $(function(){
    $("#from").datepicker().attr("autocomplete", "off");;
    $("#to").datepicker().attr("autocomplete", "off");;
  });

});
</script>

Can anyone help me? Thanks.

How to&Answers: