CODEWITHSUNDEEP
javascriptjqueryjquery-uidatepicker
Smile
Smile

Reputation: 2758

How to pass multiple datepickers value as an array to php

I am following this Set multiple jQuery Datepickers' value based on one jQuery Datepicker's selected date which is already asked by me and also received answer as well.

I have following multiple dates on a page and change on first date picker will change values for other date pickers on the screen.

First date picker is one which value will changes values for other date pickers.

enter image description here

Note: Please note that I want to display Date Picker from Image and don't want to use input type as text

I want to know the best way to store this values to server. You can see my current code same as suggested in answer in above question.

$("#datepicker1, #datepicker2, #datepicker3, #datepicker4").datepicker();
$("#datepicker1").datepicker("option", "onSelect", function (dateText, inst) {
    var date1 = $.datepicker.parseDate(inst.settings.dateFormat || $.datepicker._defaults.dateFormat, dateText, inst.settings);

    var date2 = new Date(date1.getTime());
    date2.setDate(date2.getDate() + 1);
    $("#datepicker2").datepicker("setDate", date2);

    var date3 = new Date(date1.getTime());
    date3.setDate(date3.getDate() + 2);
    $("#datepicker3").datepicker("setDate", date3);

    var date4 = new Date(date1.getTime());
    date4.setDate(date4.getDate() + 3);
    $("#datepicker4").datepicker("setDate", date4);
});

But I would like to implement it through js array and then want to save data from PHP.

Can anybody guide me on this?

If there would be little code help then it will be very great help for me.

Upvotes: 0

Views: 1478

Answers (1)

panepeter
panepeter

Reputation: 4242

If you want to store your data asynchronously (without full page reload) you can simply make use of jQuerys post function: 

$('#submit_btn').click(function(){
    $.post( "handler.php", { 
        dp1: $("#datepicker1").val(), 
        dp2: $("#datepicker2").val(), 
        dp3: $("#datepicker3").val(), 
        dp4: $("#datepicker4").val()
    })
        .done(function( data ) {
             alert( "Data successfully stored!");
     });
});

Suggesting that you use an HTML submit button*:

<input type="submit" id="submit_btn" value="send" />

In this example, you would have a handler.php file in the same directory. In this file, you could access the datepicker values through 

$_POST['dp1'], $_POST['dp2'] etc.

If you really want to pass an array for some reason (I would pass 4 values just like this), you should transfer a JSON object and decode it in php via

json_decode()

Hope this helps!!

*regarding your markup from the post you referenced, I would suggest packing all the datepickers in a element. Although not necessary, this is syntactically correct and allows you to bind to the "submit" event instead of the click event on the button.

Upvotes: 1

Related Questions