How to use input value assigned by javascript onclick in a php form post

Question

i have a form with two buttons, two datepickers and one hidden input. if the oneway button is clicked the return datepicker becomes hidden and the value of the input is changed to oneway. clicking the return button reverts the process and and the value of the input is changed to return.

 <script>
  $(document).ready(function() {
   $("label[name='oneway']").on("click", function(){
     sessionStorage.setItem("btnActive", "oneway");
     $(".returnpicker").hide();
     $("label[name='return']").removeClass('active');
     $(this).addClass('active');
     document.getElementById('hiddeninput').value = "oneway";
 });
 $("label[name='return']").on("click", function(){
    sessionStorage.setItem("btnActive", "return");
    $(".returnpicker").show();
    $("label[name='oneway']").removeClass('active');
    $(this).addClass('active');
    document.getElementById('hiddeninput').value = "return";
 });
 let sessionState = sessionStorage.getItem("btnActive");
  if( sessionState == "oneway") {
     $(".returnpicker").hide();
     $("label[name='return']").removeClass('active');
     $(this).addClass('active');
     document.getElementById('hiddeninput').value = "oneway";
   } else {
    sessionStorage.setItem("btnActive", "return");
    $(".returnpicker").show();
    $("label[name='oneway']").removeClass('active');
    $(this).addClass('active');
    document.getElementById('hiddeninput').value = "return";
   }
  });
 </script>

My html looks like this

<form method="post" action="">
  <input type="hidden" id="hiddeninput" name="hiddeninput">
  <div class="form-row">
   <div class="btn-group btn-group-toggle" data-toggle="buttons">
    <label for="oneway" class="btn btn-default " name="oneway">One way</label>
    <label for="return" class="btn btn-default " name="return">Return</label>
   </div>

   <div class="form-group col-lg-3 departure">
    <label for="OnewayDatepicker">Departure Date</label>
    <div class="input-group date">
     <span class="input-group-addon"><i class="fa fa-calendar"></i></span>
     <input id="date_added" type="text" name="OnewayDatepicker"class="form-control" value="<?php echo isset($_POST['OnewayDatepicker']) ? $_POST['OnewayDatepicker'] : '' ?>">
    </div>
     <div class="mb-3">
      <?php if (isset($OnewayDatepicker_err )) echo '<p class="text-danger"><small>' . $OnewayDatepicker_err . ' </small></p>'; ?>
     </div>
   </div>

   <div class="form-group col-lg-3 arrival">
    <label for="ReturnDatepicker">Arrival Date</label>
    <div class="input-group date">
     <span class="input-group-addon"><i class="fa fa-calendar"></i></span>
     <input id="date_modified" type="text" name="RetunDatepicker"class="form-control" value="<?php echo isset($_POST['RetunDatepicker']) ? $_POST['RetunDatepicker'] : '' ?>">
    </div>
     <div class="mb-3">
      <?php if (isset($ReturnDatepicker_err )) echo '<p class="text-danger"><small>' . $ReturnDatepicker_err . ' </small></p>'; ?>
     </div>
   </div>

 </div>
 <div>
  <button type="submit" name="confirm" class="btn btn-primary btn-lg " id="confirm">Confirm</button>
 </div>

</form>

And my php

<?php 
 $OnewayDatepicker_err = "";
 $RetunDatepicker_err = "";
 $OnewayDatepicker = $_POST['OnewayDatepicker'];
 $RetunDatepicker = $_POST['RetunDatepicker'];
 $hiddeninput = $_POST['hiddeninput'];

 if (isset($_POST["confirm"])) {

   if (empty($OnewayDatepicker)) {
    $OnewayDatepicker_err = " * Choose Departure Date";
   } else {
    $OnewayDatepicker_err = "";
   }

   if ((empty($RetunDatepicker)) && ($hiddeninput == "return")) {
    $RetunDatepicker_err = " * Choose Return Date";
   } else {
    $RetunDatepicker_err = "";
   }
 }
?>

Everything works fine except this part of the code "&& ($hiddeninput = "return")".

it seems php doesn't recognize the value the JS has passed into the hidden input or am i doing something wrong?

`$hiddeninput = "return"` is an assignment, not a comparison. — 04FS, Dec 12 '19 at 12:43
i changed this $hiddeninput = "return" to this $hiddeninput == "return" and it still won't return any error id the field is blank — Otun Musa Bashir, Dec 12 '19 at 13:00
_...and it still won't return any error id..._ - you're not returning anything. You are only assigning a variable with `$RetunDatepicker_err = " * Choose Return Date";`. You need to use the `echo` keyword or possibly `return` depending on what you need. — waterloomatt, Dec 12 '19 at 13:45
Also, check your browser's console to see if your hidden field is actually sending the value you think it is. You have a lot of _if statements_ around the JS which sets the value. Decent chance the value is not what you think it is. — waterloomatt, Dec 12 '19 at 14:24
Yes i have that echoed in my html body below the datepicker input int the
tag, i and it works if i check only for empty "if (empty($RetunDatepicker))", and to be sure if the hidden input gets the value, i changed the hidden to text to see the value as it changes. — Otun Musa Bashir, Dec 12 '19 at 15:35
i checked the browser console and i have the value of the hiddeninput as value instead of value="return" even as i have return as the value in the input — Otun Musa Bashir, Dec 12 '19 at 15:51
I don't know what to tell you. I copied and pasted your code (added in jQuery library) and it is going into that final _if statement_. Make sure to turn on error reporting because your code is throwing notices. https://stackoverflow.com/a/21429652/296555. — waterloomatt, Dec 12 '19 at 15:56

How to use input value assigned by javascript onclick in a php form post

0 Answers0