title: How to set custom date to DatePicker of react-datepicker using MomentJS?
body: <p>I have stored dates in database. I can fetch dates successfully. But when it comes to set any particular date to DatePicker of <a href="https://www.npmjs.com/package/react-datepicker" rel="nofollow noreferrer">react-datepicker</a>, I couldn't set that date. </p>
  
  <p>Here is code that I have used for fetching dates and setting state with the value of date.</p>
  
  <pre><code>loadAllEvents() {
      axios({
          method: 'POST',
          url: '/api/Account/SelectAllDatesFromDb',
          contentType: 'application/json',
          data: {},
      }).then(function (response) {
          if(response!=null){     
              this.setState({
                  eventList: response.data
              });
              this.updateAllDates();
          }
          else {
              this.setState({
                  eventList: []
              });
          }
  
      }.bind(this))
          .catch(function (error) {
              console.log(error);
          });
  }
  </code></pre>
  
  <p>UpdateAllDates() function for converting dates using <a href="https://momentjs.com" rel="nofollow noreferrer">MomentJs</a></p>
  
  <pre><code>updateAllDates() {
          for (var i = 0; i &lt; this.state.eventList.length; i++) {
              var items = this.state.eventList;
              items[i].event_date = moment(this.state.eventList[i].event_date).format("DD/MM/YYYY");
              this.setState({ eventList: items });    
          }
      }
  </code></pre>
  
  <p>After getting dates, now I try to set date to datepicker and try to set <code>selected</code> parameter. Here is code:</p>
  
  <pre><code>&lt;InputGroup&gt;
    &lt;DatePicker
      className="form-control"
      dateFormat="dd/MM/yyyy"
      maxDate={new Date()}
      isClearable={true}
      selected={this.state.eventList[0].event_date}
      onChange={this.handleChange}
      disabled={this.state.eventDateBox}
      showYearDropdown
      showMonthDropdown
    /&gt;
  </code></pre>
  
  <p>   </p>
  
  <p>When I runs code I get error - <code>TypeError: Cannot read property 'event_date' of undefined</code>:
  <a href="https://i.stack.imgur.com/uqCc0.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/uqCc0.png" alt="enter image description here"></a></p>
  
  <p>Where am I making mistake? Is there any other way of setting a date to DateTimePicker with default/custom date?</p>