日期时间选择器不使用现有数据进行输入

Question

我遇到了datetimepicker的问题。我有一个有日期输入的表单。这些输入适用于提交。但是，可以编辑表单，当用户编辑表单时，所有输入都会填入其（用户）信息。

出于某种原因，当我在数据已经存在时单击日历输入的日历按钮时，会出现一个带有一条线的小圆圈，并且不允许我选择一个新的日期。

如果我进入输入并删除日期，那么我可以使用选择器选择一个新日期。但是，这将在提交时的数据库中写为空日期。

$('.date').datetimepicker({
  formatDate: 'yyyy-mm-dd',
  pickTime: false
});

<td class="text-left">
  <div class="input-group date required">
    <input type="text" name="component_module[<?php echo $component_row; ?>][component_start_date]" value="<?php echo $component_module['component_start_date']; ?>" class="form-control" />
    <span class="input-group-btn" id="component-calendar-btn">
      <button class="btn btn-default" type="button">
        <i class="fa fa-calendar"></i>
      </button>
    </span>
  </div>
</td>