pickadate.js icon indicating copy to clipboard operation
pickadate.js copied to clipboard

Change value from a picker, update value from a second one

Open Alexis067 opened this issue 7 years ago • 1 comments

I have two datepickers on my page, and I want to update the value of a picker if the other one change, the purpose is to have the same value for both pickers.

I currently have the code bellow.

It works, the value update correctly on a change, but it enter in an infinite loop, does anybody have an idea to solve this issue ?

var setPicker1 = $('#date1').pickadate({
	today: false,
	selectYears: false,
	min: 1,
	dateFormat: 'dd.mm.yyyy',
});
picker1 = setPicker1.pickadate('picker');

var setPicker2 = $('#date2').pickadate({
	today: false,
	selectYears: false,
	min: 1,
	dateFormat: 'dd.mm.yyyy',
});
picker2 = setPicker2.pickadate('picker');

// Check if there's a picker date is set
if (picker1.get('value')) {
	picker2.set('select', picker1.get('select'))
}

if (picker2.get('value')) {
    picker1.set('select', picker2.get('select'))
}

// When something is selected, update the pickers value
picker1.on('set', function (event) {

    if (event.select) {

        picker2.set('select', picker1.get('select'))

    }

    else if ('clear' in event) {

        picker2.set('select', false)

    }

})

picker2.on('set', function (event) {

    if (event.select) {

        picker1.set('select', picker2.get('select'))

    }

    else if ('clear' in event) {

        picker1.set('select', false)

    }

})

Alexis067 avatar Jun 12 '17 10:06 Alexis067

Maybe you need to use "muted callbacks" to prevent looping

https://amsul.ca/pickadate.js/api/#muted-callbacks

xtianus avatar Oct 07 '21 09:10 xtianus