修正日時ピッカーカレンダーの位置

Question

私のサイトで何らかの理由で日付ピッカーカレンダーがあるべきで、そのために入力を妨害しています。どのように私はその位置を修正できますか？

http://test.rocknraw.ru/orders

Answer 1

あなたは.bootstrap-datetimepicker-widget CSSクラスを上書きしてmargin-bottomプロパティを追加してみてくださいすることができます。

EDIT：あなたのページのコントロールを見ていて、.datepickerクラスにはmargin-top: 35pxがあります。そのプロパティを削除すると、正しい位置に配置されます。

Answer 2

最初 - あなたのコードはわかりません。

第2 - あなた自身で問題を解決できない場合は、divまたはpopoverを作成し、div内の入力日付時刻ピッカーを置き換えてください。

最終的 - これは私の第2引数を使用するコードです。

コード：

$('#date_time').datetimepicker({ 
      locale: 'id', 
      toolbarPlacement: 'bottom', 
      showTodayButton: true, 
      showClose: true, 
      showClear: true, 
      allowInputToggle: true, 
      format: 'DD/MM/YYYY HH:mm:ss', 
      icons: { 
      time: 'glyphicon glyphicon-time', 
      date: 'glyphicon glyphicon-calendar', 
      up: 'glyphicon glyphicon-chevron-up', 
      down: 'glyphicon glyphicon-chevron-down', 
      previous: 'glyphicon glyphicon-arrow-left', 
      next: 'glyphicon glyphicon-arrow-right', 
      today: 'glyphicon glyphicon-home', 
      clear: 'glyphicon glyphicon-trash', 
      close: 'glyphicon glyphicon-remove' 
      }, 
      tooltips: { 
      today: 'Hari ini', 
      clear: 'Hapus masukan', 
      close: 'Tutup', 
      selectMonth: 'Pilih bulan', 
      prevMonth: 'Bulan sebelumnya', 
      nextMonth: 'Bulan berikutnya', 
      selectYear: 'Pilih tahun', 
      prevYear: 'Tahun sebelumnya', 
      nextYear: 'Tahun berikutnya', 
      selectDecade: 'Pilih dasawarsa', 
      prevDecade: 'Dasawarsa sebelumnya', 
      nextDecade: 'Dasawarsa berikutnya', 
      prevCentury: 'Abad sebelumnya', 
      nextCentury: 'Abad berikutnya', 
      pickHour: 'Pilih jam', 
      incrementHour: 'Jam selanjutnya', 
      decrementHour: 'Jam sebelumnya', 
      pickMinute: 'Pilih menit', 
      incrementMinute: 'Menit selanjutnya', 
      decrementMinute: 'Menit sebelumnya', 
      pickSecond: 'Pilih detik', 
      incrementSecond: 'Detik selanjutnya', 
      decrementSecond: 'Detik sebelumnya', 
      togglePeriod: 'Ubah am/pm', 
      selectTime: 'Pilih waktu' 
      } 
     }); 
     $('#calendar-status').click(function(event) { 
     $('.elmahbub-popover-bottom').css('width', 'auto').slideToggle().after().parent().css('position', 'relative'); 
    }); 

とHTML：

<button class="btn-xs pull-right margin-secondary btn-border bg-white icon-attachment" type="button" data-toggle="tooltip" data-placement="bottom" id="calendar-status" title="Tanggal"><b class="glyphicon glyphicon-calendar grey fontsize-xsmall"></b></button> 
<div class="input-group date elmahbub-date-time-picker elmahbub-popover-bottom"> 
       <div align="center"> 
       <span class="fontsize-xsmall black roboto margin-bottom10">Tanggal dan waktu</span> 
       <input id="date_time" type="text" name="tanggal_status" placeholder="Masukkan tanggal dan waktu" class="form-control fontsize-xsmall" style="height:28px"> 
       </div> 
       </div>