reactjsreact-reduxreact-datepicker

How to add a button to react-date-range

import { DateRangePicker } from 'react-date-range';

<DateRangePicker
   onChange={(item) => { this.handleonDateRange(item)}}
   showSelectionPreview={true}
   moveRangeOnFirstSelection={false}
   months={2}
   ranges={this.state.dateRange}
   direction="horizontal"
/>

And the image is image

How can I add an Apply button in the bottom right corner ?? So that when the user clicks on Apply button I can hide the calendar

Solution

  • There isn't a option to provide a button in react-date-range as of now, But we can enclose DateRangePicker inside a Bootstrap React-Modal and we can add a button in Bootstrap React-Modal