Datepicker not show on Bootstrap popover

Question

I use a simple Bootstrap pophover, But i face problem when i insert Datepicker under this pophover, then Datepicker it's not show. but, normal Datepicker is work if i don't insert it under pophover.

<div id="popover-content" class="hide">
                <form class="form-inline" role="form">
                    <div class="clearfix ">
                        <div class="checkbox">
                            <label>
                                <input id="asap" type="checkbox"> ASAP
                            </label>
                        </div>
                    </div>
                    <div class="clearfix hideevent">
                        <div class="form-group"> 
                            <div class="checkbox">
                                <label>
                                    <input name="morning" type="radio"> Morning
                                </label>
                            </div>
                            <div class="checkbox">
                                <label>
                                    <input name="morning" type="radio"> Evening
                                </label>
                            </div>
                        </div>
                        <input class="form-control" id="date" name="date" placeholder="MM/DD/YYYY" type="text"/>
                    </div>
                </form>
            </div>

$("[data-toggle=popover]").popover({
            html: true, 
            content: function() {
              return $('#popover-content').html();
            }
        });

$('#date').each(function() {
            $(this).datepicker('clearDates');
        });

Answer 1

You can used your popover html content in data-content='' attribute

<input type="text" data-content=' popover html paste here ' readonly id="PopS" data-placement="bottom" data-toggle="popover" data-html="true" placeholder="Quando" class="form-control" data-container="body"/>

Then write bellow script:

<script>
$("#PopS").popover({
    html: true
}).on('shown.bs.popover', function () {
    $('#date').datepicker({
     format: 'dd/mm/yyyy',
    });
});
</script>

Note: in this <div id="popover-content" class="hide"> remove class="hide"

Answer 2

$('[data-toggle=popover]').on('show.bs.popover', function () {
  $('#date').datepicker();
})

try this one.