creativetimofficial / ct-material-dashboard-pro

Material Dashboard Pro - Premium Bootstrap 5 Admin
https://demos.creative-tim.com/material-dashboard-pro/pages/dashboards/analytics
116 stars 28 forks source link

[Bug] Calendar label overlaping in form-group #249

Open spola opened 5 years ago

spola commented 5 years ago

Version

2.1.0

Reproduction link

https://jsfiddle.net/spola/oux10cvh/

Operating System

Mac OS

Device

Macbook Pro

Browser & Version

Chrome Versión 75.0.3770.142 (Build oficial) (64 bits)

Steps to reproduce

  1. Click in input datetime, calendar was displayed and the input is filled
  2. Click/tab to another input, loosing focus of datetime input
  3. Label overlap the input

    What is expected?

    Label floating

    What is actually happening?

    Label overlapint


Solution

Additional comments

The documentation doesn't show how to use the date picker with form group

bouskdav commented 5 years ago

I fixed it by triggering keydown event when datepicker value changes. Like that:

$(yourdatepickerselector).on('dp.change', function (event) {
    $(this).trigger('keydown');
});
spola commented 5 years ago

Thanks, It's work! you saved us!