How to send multiple jQuery datepicker values to a database

Question

I am creating a website that facilitates setting a meeting time for a group of people, very much like WhenIsGood.

When creating a new meeting, users start by inputting the dates that a meeting could possibly occur (using a jQuery datepicker with form inputs). The form starts with three fields, but users can add more as needed. My question is, how can I store the date values so that they can be used later? The values will be used again in the meeting creation process when users have to select a time range for each submitted date value. Also, the final tentative schedule (days submitted and time ranges submitted) will need to be made available to group members. I know, this is pretty abstract at the moment, and I'll be more than happy to give more details if necessary. Here is the page in question.

My main concern is figuring out how to store the values without knowing how many values there will be. If anyone could point me in the right direction, I would greatly appreciate it. I have a SQL database that I have set up and am using. I assume the data would be stored there since, you know, it's a database. Or if there's a better way, that's cool too. Thanks in advance.

<?php 
include 'core/init.php';
//protect_page();
include 'includes/overall/header.php'; 
?>    

      <form action="sendemail.php" method="post">
      <link rel="stylesheet" href="css/jquery-ui.css" />
      <script src="js/jquery-1.9.1.js"></script>
      <script src="js/jquery-ui.js"></script>
      <script>
           $(document).ready(function() {
                var count = 4;
                $(".datepicker").datepicker({ dateFormat: 'yy-mm-dd', minDate: '+0D', numberOfMonths: 2});
                $( 'input[type="text"]' ).datepicker();

                $("#addDate").click(function(){
                     $('#dateholder').append('<p>Date: <input id="dp' + count + '" type="text" class="datepicker" /></p>');
                     count++;
                     $(".datepicker").datepicker({ dateFormat: 'yy-mm-dd', minDate: '+0D', numberOfMonths: 2});
                     $( 'input[type="text"]' ).datepicker();
                });
           });               
      </script>

      <h1>Create a Meeting</h1>
      <div style="display: inline-block; margin-left: 20%;">
      <div id="dateholder" style="text-align:center;">
           <p>Date: <input id="dp1" type="text" class="datepicker" /></p>
           <p>Date: <input id="dp2" type="text" class="datepicker" /></p>
           <p>Date: <input id="dp3" type="text" class="datepicker" /></p>
      </div>
      <div style="text-align:center;">
           <p><input type="button" value="Add Date" id="addDate" /> <input type="submit" value="Submit Dates"/></p>
      </div>
      </div>
      </form>

<?php include 'includes/overall/footer.php'; ?>

Lito · Accepted Answer · 2013-05-04 13:13:03Z

5

You can replace

<p>Date: <input id="dp1" type="text" class="datepicker" /></p>
<p>Date: <input id="dp2" type="text" class="datepicker" /></p>
<p>Date: <input id="dp3" type="text" class="datepicker" /></p>

with

<p>Date: <input name="dp[]" type="text" class="datepicker" /></p>

After you can read in PHP page:

<?php 
   for ($i = 0; $i < count($_POST['dp']); $i++){
       echo $_POST['dp'][$i]."<br/>";        
   }

 ?>

edited May 4, 2013 at 13:13

answered May 2, 2013 at 20:58

Lito

2,3191 gold badge24 silver badges31 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Chris Over a year ago

Sorry for the slow reply, and thanks for the help. This works if I use name="dp[]" rather than id="dp[]." Looking at it now, it seems really obvious. Anyway, thanks again!

Barmar · Accepted Answer · 2013-05-02 20:29:17Z

0

Use array notation for the dtepicker names:

<input name="dp[]" type="text" class="datepicker" />

Then in PHP you can access $_POST['dp'] as an array.

answered May 2, 2013 at 20:29

Barmar

789k57 gold badges555 silver badges669 bronze badges

Collectives™ on Stack Overflow

How to send multiple jQuery datepicker values to a database

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related