Highstock дата ввода JQuery позиции щ DatePicker изменения

В Highstock, вы можете использовать JQuery щ DatePicker вместо ввода текста в поля даты, так как в этом демо ... http://jsfiddle.net/hcharge/aNde9/Highstock дата ввода JQuery позиции щ DatePicker изменения

datepicker

При нажатии на вход один раз, открывается датапикер, где он должен быть ниже поля ввода, однако, если вы закроете его и снова откройте, он будет придерживаться верхней части контейнера. Реализованный на веб-странице, это будет верхней частью окна браузера.

Это известная проблема?

источник

2013-02-21 hcharge

Datepicker управляет своим вертикальным положением с помощью атрибута «top» стиля виджета - по какой-либо причине «top» всегда устанавливается в 0 в последующих активациях даты.

Облегчает обход, хотя, если у нас есть данные виджетов, «помнят» правильную позицию и явно устанавливая эту позицию в последующих вызовах. ВИДЕТЬ «OnClose» и функции «beforeShow» определены в опциях Datepicker ниже:

$.getJSON('http://www.highcharts.com/samples/data/jsonp.php?filename=aapl-c.json&callback=?', function(data) { 
    // Create the chart 
    window.chart = new Highcharts.StockChart({ 
     chart : { 
      renderTo : 'container' 
     }, 

     rangeSelector : { 
      selected : 1, 
      inputDateFormat: '%Y-%m-%d', 
      inputEditDateFormat: '%Y-%m-%d' 
     }, 

     title : { 
      text : 'AAPL Stock Price' 
     }, 

     series : [{ 
      name : 'AAPL', 
      data : data, 
      tooltip: { 
       valueDecimals: 2 
      } 
     }] 

    }, function(chart){ 

     // apply the date pickers 
     setTimeout(function(){ 
      $('input.highcharts-range-selector', $('#'+chart.options.chart.renderTo)) 
      .datepicker({ 
       beforeShow: function(i,obj) { 
        $widget = obj.dpDiv; 
        window.$uiDatepickerDiv = $widget; 
        if ($widget.data("top")) { 
         setTimeout(function() { 
          $uiDatepickerDiv.css("top", $uiDatepickerDiv.data("top")); 
         },50); 
        } 
       } 
       ,onClose: function(i,obj) { 
        $widget = obj.dpDiv; 
        $widget.data("top", $widget.position().top); 
       } 
      }) 
     },0) 
    }); 
});

Вот link to jsFiddle

источник

2013-03-07 13:04:13 marty

вышеупомянутое решение работает очень хорошо. ты это попробовал? – jeev

Да, я думаю, что мы постараемся пойти с этим, стыдно, что это не получается из коробки, спасибо очень много – hcharge

Но при использовании нескольких графиков и использовании нескольких datapickers это решение выходит из строя. Он показывает, что datapicker всегда находится на одном графике, а не в том, который вы нажимаете, чтобы показать даты. См. Демонстрацию: http://jsfiddle.net/aNde9/52/ – Alvaro

Вам необходимо установить одинаковые входные форматы, или изменить datepicker dateFormat так же, как в Highstock, или изменить inputRangeFormat в Highstock.

источник

2013-02-21 16:51:11

Я обновил скрипку с согласования форматов, но, кажется, не имеет никакого значения, это очень странная ошибка – hcharge

у вас есть ошибка в формате ''% Y- & m-% d'', тогда как ''% Y-% m-% d''. См .: http://jsfiddle.net/aNde9/4/ –

Я понял эту ошибку и исправил ее, но все равно работает не так, как ожидалось, вы видите, о чем я говорю? Датчик даты прилипает к верхней части контейнера ... – hcharge

Highstock дата ввода JQuery позиции щ DatePicker изменения

ответ

Смежные вопросы