Time picker doesnt open inline

import React, { Component } from "react";
import { MDBTimePicker, MDBCol, MDBBtn } from "mdbreact";

class TimePickerPage extends Component {

componentDidMount() {
  const pickerInput = document.getElementById('timePicker');
  const pickerLabel = document.querySelector('label[for="timePicker"]');

  pickerLabel.style.transform = 'translateY(-20px) scale(0.8)';
  pickerInput.parentNode.style.display = 'inline';
}

render() {
  return (
      <MDBCol className='mt-5' md="6">
        <MDBBtn style={{ display: 'inline' }}>Test</MDBBtn><MDBTimePicker id="timePicker" label="12hrs format" />
      </MDBCol>
    );
  }
}

export default TimePickerPage;

Elaheh commented 3 years ago

hi , your code in dont working myproject i need inline timepicker in myproject please help me.

---

Krzysztof Wilk staff commented 3 years ago

Hi!

If you meant an example like this one https://mdbootstrap.com/docs/b5/react/forms/timepicker/#section-inline-12 - I'm afraid there's no inline version of the MDBTimePicker component in the MDB4 package.

Keep coding!

---