jQuery datepicker with Highstocks / Highcharts

Question

How can I get a working jQuery datepicker with highcharts rangeselector?

This fiddle is an old example (from a highcharts author) which has the problem.

http

Answer 1

perhaps this will help

Change range in Highstock dynamically

I be able to update configuration of the displayed chart on the fly by accessing axis objects.

Answer 2

You could set extremes once a date is selected, using your onSelect event and removing this.onchange().

$.datepicker.setDefaults({
        dateFormat: 'yy-mm-dd',
        onSelect: function(dateText) {
            chart.xAxis[0].setExtremes($('input.highcharts-range-selector:eq(0)').datepicker("getDate").getTime(), $('input.highcharts-range-selector:eq(1)').datepicker("getDate").getTime()); 
            //this.onchange();
            this.onblur();
        }
    });

Example:

http://jsfiddle.net/BWEm5/542/