2016-08-15 3 views
1

Пожалуйста, обратите внимание на мою jsFiddle:Невозможно получить JQuery UI DatePicker появляться на двух вкладках

https://jsfiddle.net/MrSnrub/w8rem1be/

Два datepickers и успешно появляются на первой вкладке («Stock Price»). Но ни один из них не отображается на второй вкладке «Перемещение процентов». Тем не менее, они оба называют с использованием относительно подобный код (как часть процесса создания объекта Highstock):

Первый набор datepickers:

function(chart) { 

    // apply the date pickers 
    setTimeout(function() { 
    $('input.highcharts-range-selector', $('#tabs-1')).datepicker() 
    }, 0) 
}); 

Второй набор datepickers:

function(chart) { 

    // apply the date pickers 
    setTimeout(function() { 
    $('input.highcharts-range-selector', $('#tabs-2')).datepicker() 
    }, 0) 
}); 

Что я делаю неправильно во втором вызове функции?

+2

Похоже, ваши даты и времени входа на второй вкладке не может быть найден. Посмотрите изображение с консоли. Первый возвращает ожидаемые входы, второй возвращает null, и, следовательно, вы не создаете сборщик datetime. Похоже, что у ваших входов нет необходимых классов. Если вы наберете $ ('input', $ ('# tabs-2')) в консоли, вы увидите, что есть только один элемент ввода, а один из них имеет тип «скрытый». Спасибо @Barmar за указание на это больше в форме комментариев. – Nesaje

ответ

0

Внутри div#div-highstock-stock-price-chart у вас есть div с необходимыми входами внутри него.

Добавьте ту же самую/подобную разметку html внутри div#div-highstock-percentage-change-chart, к которой может присоединяться datepicker.

Кредит Несае за это первое.

+0

Highcharts создает divs, а не его HTML. Почему highcharts создает второй набор элементов управления по-другому, чем первый? Настройка выглядит одинаково. –

+0

Какие «входы» следует искать? Я пишу console.log ($ ('# div-highstock-stock-price-chart')); и есть, как сотня различных свойств, перечисленных. – MrSnrub

+0

@Barbara right, highchart создает эти элементы. Боюсь, я не знаю, как исправить highchart. – yezzz

0

Это потому, что диаграммы не отображаются правильно, если они скрыты.

Эта ошибка исправлена ​​в ветке исправления Highstock. Связанные вопрос: https://github.com/highcharts/highcharts/issues/5231

Работа демо используя упомянутый версия Highstock: http://jsfiddle.net/w8rem1be/26/

<script src="http://github.highcharts.com/bugfix/highstock.js"></script> 
Смежные вопросы