import React, { Component, PropTypes } from 'react'
import $ from 'jquery'
import 'jquery-ui/ui/widgets/datepicker'

class DatePicker extends Component {
  componentDidMount() {
    SELF = this;
    $('.datepicker').datepicker({
      changeMonth: true,
      changeYear: true,
      showButtonPanel: true,
      yearRange: '-35:-1',
      dateFormat: 'mm/dd/yy',
      onSelect: function(dateText, inst) {
        var date = $(this).val();
        // $("#datepickerDOB").val(date);
        SELF.props.setValue('dob',date);
      }
    });
  }

  render() {
    return (
      <input
        id="datepickerDOB"
        type="text"
        className="datepicker form-control"
        placeholder="DD-MM-YYYY"
        onChange={this.props.onChange}
        value={this.props.value}
      />
    )
  }
}

DatePicker.propTypes = {
  value: PropTypes.string.isRequired,
  onChange: PropTypes.func.isRequired,
}

export default DatePicker