
jquery-datepicker - issue #382
how can we use multiple linked datePickers with start and end dates?
Hi Kelvin,
I have used one of your datepicker example(http://www.kelvinluck.com/assets/jquery/datePicker/v2/demo/datePickerStartEnd.html) in our website and we have faced one problem while using this. below is the case where we have got the issue
we have array of products and we need to select subscription start and end dates for each product so in my code I have looped all my products and each products has its own start and end date picker form. I have added your date picker code in each loop and it only work for first product and for remaining products only show calendar but binding doesn't work.
Below I have attached screenshots of my pages. first one is to show list of products and here for each product I have a button called subscription and If I click on button it will show popup with your date picker start and end date code. So for each product I have popup to show start and end dates.
here is my code
$(function()
{
$('.date-pick').datePicker()
$('#start-date').bind(
'dpClosed',
function(e, selectedDates)
{
var d = selectedDates[0];
if (d) {
d = new Date(d);
var start_date = d.getFullYear() + '-' + ('0' + (d.getMonth()+1)).slice(-2) + '-' + ('0' + d.getDate()).slice(-2);
alert(start_date);
$('#end-date').dpSetStartDate(d.addDays(1).asString());
}
}
);
$('#end-date').bind(
'dpClosed',
function(e, selectedDates)
{
var d = selectedDates[0];
if (d) {
d = new Date(d);
var end_date = d.getFullYear() + '-' + ('0' + (d.getMonth()+1)).slice(-2) + '-' + ('0' + d.getDate()).slice(-2);
alert(end_date);
$('#start-date').dpSetEndDate(d.addDays(-1).asString());
}
}
);
});
I have alerted the selected date for start and end date for each binding but alert is comes only for first product and for remaining products it is not alerting selected dates.
Any help on this?
- productlist.png 34.65KB
- productpopup.png 38.19KB
Comment #1
Posted on Jun 16, 2014 by Happy GiraffeFirstly, please don't ask the same question in multiple places!
Secondly, please provide a link to your code, without seeing the actual code running I can just guess what the problem is...
My guess is that you are using the same ID for multiple elements on the page. This is illegal HTML... You will need to give them unique IDs and you will need to change the $('#start-date') and $('#end-date') selectors so that they point at the relevant pairing... How you do this will depend on your markup but is more of a general javascript query than a date-picker specific one - I recommend asking on stackoverflow.com
Status: Invalid
Labels:
Type-Defect
Priority-Medium