Datetimepicker did not work on element that append form javascript

Question

I have one input date, this input append from js like this

    var inputdate = '<input type="text" name="date[]" class="form-control date" placeholder="Input date"';
    $("form").append(inputdate);

And the html code is like this :

    <form method="POST">
       ...
    </form>

Initialize datetimepicker

$('.date').datetimepicker({
       format: 'YYYY-MM-DD'
});

The input element append succesfully and the other form that have input date work with datetimepicker. But the element that append from js is not showing datetimepicker, is there any mistakes?

Answer 1

I think you missed one thing here.

var inputdate = '<input type="text" name="date[]" class="form-control date" placeholder="Input date"';

It should have > at the end of string.

The initialization code should be Reexecuted after we append inputDate into $('form').

So the code should be:

var inputdate = '<input type="text" name="date[]" class="form-control date" placeholder="Input date">';

$("form").append(inputdate);

$('.date').datetimepicker({format: 'YYYY-MM-DD'});