Two dependent pickmeup

[cargocash]

How to make sure that when picking a date in pickup_start, does this date become min in pickup_end?

var pickup_start=document.getElementById('pickup_start');
var pickmeup_end=document.getElementById('pickmeup_end');
var now = new Date;
pickmeup(pickup_start, {
    min:new Date,
    hide_on_select : true
});
pickmeup(pickmeup_end, {
    hide_on_select : true
});

pickup_start.addEventListener('pickmeup-change', function (e) {   
    pickmeup(pickmeup_end, {
         render : function (date) {
            if (date < e.detail.date) {
                return {disabled : true, class_name : 'date-in-past'};
            }
            return {};
        } 
    }).update(); // this code not working...
});

[nazar-pc]

The issue is that you're trying to change render option in event handler, but it can only be set once during initialization. For this code to work you need to have render in the same object as hide_on_select and then use some local variable instead of e.detail.date. Then, in event handler you'll update that variable and instance itself. Something like this (though I didn't run it myself):

var pickup_start = document.getElementById('pickup_start');
var pickmeup_end = document.getElementById('pickmeup_end');
var min_date = new Date;
pickmeup(pickup_start, {
    min:new Date,
    hide_on_select : true
});
var pickmeup_end_instance = pickmeup(pickmeup_end, {
    hide_on_select : true,
    render : function (date) {
        if (date < min_date) {
            return {disabled : true, class_name : 'date-in-past'};
        }
        return {};
    } 
});

pickup_start.addEventListener('pickmeup-change', function (e) {   
    min_date = e.detail.date;
    pickmeup_end_instance.update();
});

[cargocash]

You are a genius it's work perfectly

[nazar-pc]

Great! Feel free to open new issue if you have other questions or problems.