Question

我在选择另一个下拉列表时附加到div的表单元素上使用引导程序datepicker。 datepicker正常工作，但是我无法应用所有选项。

我不确定这是否受datepicker的限制，或者我做错了什么。 html就是

    <div class="form-group row">
        <div class="col-6 col-md-4 col-lg-3">

            <div id="dateSelector">

            </div>

        </div>
    </div>

append块看起来像这样

dateSelector.append('<label class="control-label text-muted">Event date</label>' +
                                  '<div class="input-group date" id="datepicker-group" data-provide="datepicker">' +
                                  '<input type="text" class="form-control" name="event_date">' +
                                  '<span class="input-group-addon">' +
                                  '<i class="fas fa-calendar-alt"></i>' +
                                  '</span>' +
                                  '</div>');

在同一个js文档中具有这样的选项

    $('#datepicker-group').datepicker({
  format: 'dd/mm/yyyy',
  clearBtn: true
});

我花了数小时试图解决这个问题，却看不到我要去哪里。

非常感谢任何帮助。

Answer 1

您是否遇到语法错误？

您的选择器看起来可疑。试试：

$('#dateSelector').append('....');

Answer 2

感谢Travis，使用datepicker-group上的data-date-format和data-date-clear-btn属性可以正常工作。我已经在引导文档中看到了他，并在尝试之前没有成功，但是我认为我在输入而不是div中尝试了它。

新的.append现在看起来像这样

              dateSelector.append('<label class="control-label text-muted">Event date</label>' +
                                  '<div class="input-group date" id="datepicker-group" data-provide="datepicker" data-date-format="dd/mm/yyyy" data-date-autoclose="true">' +
                                  '<input type="text" class="form-control" name="event_date">' +
                                  '<span class="input-group-addon">' +
                                  '<i class="fas fa-calendar-alt"></i>' +
                                  '</span>' +
                                  '</div>');

其他都一样。

谢谢！

带有javascript追加的Bootstrap Datepicker选项不起作用

2 个答案: