CODEWITHSUNDEEP
jquerytwitter-bootstrapdatepickerpopover
SUN
SUN

Reputation: 973

jquery datePicker not working inside bootsrap popover

I have popover in which I placed html contents. In side popover I have text box which shows calendar. This works if textbox is outside popover but same function not working inside popover.

<div id="status2_popover" class="status-popover" style="display: none">
     <div>
         <span class="field-heading">Confirm Date</span>
         <asp:TextBox ID="TextBox2" runat="server" CssClass="date-time-picker field-pitch in-popover-text-box"></asp:TextBox>
     </div>
</div>

UPDATE

<div id="status1UpdateBox" class="update-box" data-placement='bottom' data-toggle="popover">
                               <strong>Booked</strong> <asp:Label ID="Lblstatus1Date" runat="server" Text="10/10/2016"></asp:Label> <asp:Label ID="LblStatus1Time" runat="server" Text="10.30am"></asp:Label>
                           </div>

<script>
    $(document).ready(function () {
        $('#status1UpdateBox').popover({
            html: true,
            content: function () {
            return $('#status1_popover').html();
        }
     });
   });
</script>

datepicker jquery

$.datetimepicker.setLocale('en');
        $('.date-time-picker').datetimepicker({
            timepicker: false,
            format: 'd/m/Y',
            formatDate: 'Y/m/d',
        });

Upvotes: 0

Views: 454

Answers (1)

NoseBagUK
NoseBagUK

Reputation: 365

I assume you are using the bootstrap popover library?

The problem is probably that when you setup the datetimepicker the content of the popover does not exist. You have to initialise the datetimepicker when the popover has been created. Assuming you are using the bootstap popover you could do it like this...

 $('#status1UpdateBox').on("shown.bs.popover", function() {
     var popover = $(e.target).data('bs.popover');
     popover.$tip.find(".date-time-picker").datetimepicker({
        timepicker: false,
        format: 'd/m/Y',
        formatDate: 'Y/m/d',
    });
 })

Upvotes: 1

Related Questions