发送多个表单datePicker数据到相同的目的地

时间:2018-09-24 12:43:18

标签: javascript php html ajax

我在一个div中创建多个唯一的datepicker实例,然后以表格形式提交日期时遇到了问题。

我的问题是我的div当前具有构建此表单的多个数组元素:

<?php foreach($expiredPages as $expiredPage): ?>
<form id="updateTime_<?php echo $expiredPage['id']?>" class="updateTime" method="POST">
                    <input type="hidden" name="currentPageID" value="<?php echo $expiredPage['id']?>">
                    <div class="datepick input-group date" id="datetimepicker_<?php echo $expiredPage['id']?>" data-target-input="nearest">
                      <input type="text" class="form-control datetimepicker-input" data-target="#datetimepicker_<?php echo $expiredPage['id']?>" name="datePicker<?php echo $expiredPage['id']?>" />
                      <span class="input-group-addon" data-target="#datetimepicker_<?php echo $expiredPage['id']?>" data-toggle="datetimepicker">
                      <span class="fa fa-calendar"></span>
                      </span>
  <input type="submit" name="Extend Date" class="extendDate">
</form>
<?php endforeach; ?>

这意味着我在div中有3个表单,每个表单都有自己的日期选择器和“提交”按钮。我已经解决了这一问题,以确保每个日期选择器都可以独立工作,但是我不知道如何将我的两个输入唯一地传递给PHP。

我遇到了currentPageID和datePicker的未定义索引错误

JS:

<script type="text/javascript">
            $(".extendDate").click(function(){
            event.preventDefault();
            var string = $('.updateTime').serialize();
            console.log(string);

              // AJAX Code To Submit Form.
                  $.ajax({
                      type: "POST",
                      url: "extendTime.php",
                      data: string,
                      dataType: 'json',
                      cache: false,
                      success: function(response){
                        location.reload();
               }
           });
       });
  </script>

extendTime.php

$pageID = $_POST['currentPageID'];
$dtPick = 'datePicker' . $pageID;
$newTime = $_POST[$dtPick];

$newEndTime = DateTime::createFromFormat('m/d/Y h:i A', $newTime);
$convertedDateTime = $newEndTime->format('Y-m-d H:i:s');

$extendExpiration = "
  UPDATE pages 
  SET end_time = '$convertedDateTime'
  WHERE id = '$pageID';
";

if($mysqlConn->query($extendExpiration)=== TRUE){
  echo "SUCCESS";
}else{
  echo "Could not extend Time";
}

1 个答案:

答案 0 :(得分:1)

关于您的php,您没有名为datePicker的发布键...

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="flexCont">
    <div class="flexItem">
    <div class="overlay-items"></div>
       <div class="flexItem1">
          <p>Place</p>
          <h3>u &amp; d 4</h3>
          <a href="http//link/u-d/">sometext bla bla </a><br><a href="http//link/u-d/"><i class="x-icon x-icon-arrow-right" data-x-icon="" aria-hidden="true"></i></a>
       </div>
       <div class="flexItem2"><img src="https://meme.xyz/uploads/posts/t/l-1229-the-two-states-of-every-programmer.jpg"></div>
    </div>
    <div class="flexItem">
    <div class="overlay-items"></div>
       <div class="flexItem2"><img src="https://meme.xyz/uploads/posts/t/l-1229-the-two-states-of-every-programmer.jpg"></div>
       <div class="flexItem1">
          <p>Place</p>
          <h3>d &amp; u 3</h3>
          <a href="http//link/d-u/">sometext bla bla </a><br><a href="http//link/d-u/"><i class="x-icon x-icon-arrow-right" data-x-icon="" aria-hidden="true"></i></a>
       </div>
    </div>
    <div class="flexItem">
    <div class="overlay-items"></div>
       <div class="flexItem1">
          <p>Place</p>
          <h3>d &amp; u 2</h3>
          <a href="http//link/matrimonio-test2/">sometext bla bla </a><br><a href="http//link/matrimonio-test2/"><i class="x-icon x-icon-arrow-right" data-x-icon="" aria-hidden="true"></i></a>
       </div>
       <div class="flexItem2"><img src="https://meme.xyz/uploads/posts/t/l-1229-the-two-states-of-every-programmer.jpg"></div>
    </div>
    <div class="flexItem">
    <div class="overlay-items"></div>
       <div class="flexItem2"><img src="https://meme.xyz/uploads/posts/t/l-1229-the-two-states-of-every-programmer.jpg"></div>
       <div class="flexItem1">
          <p>Place</p>
          <h3>u &amp; d 1</h3>
          <a href="http//link/matrimonio-test/">sometext bla bla </a><br><a href="http//link/matrimonio-test/"><i class="x-icon x-icon-arrow-right" data-x-icon="" aria-hidden="true"></i></a>
       </div>
    </div>
 </div>

不存在... 您可以在输入名称中添加一个ID:

$_POST['datePicker'];

一个简单的修复应该是这样的:

<input type="text" class="form-control datetimepicker-input" data-target="#datetimepicker_<?php echo $expiredPage['id']?>" name="datePicker<?php echo $expiredPage['id']?>" />