Problem with ajax loaded Kartik DateRangePicker


(Steve) #1

I’m using fullCalendar and two date range pickers, one for a new calendar event, and one for edit calendar event. The new calendar event date range picker gets loaded at page load and works. The edit picker is ajax loaded and does not work properly. The date and time dropdowns flash and then disappear when clicked.

Here’s the calendar click event that calls the edit form:

    $.get('/group/edit-event', {id:" . $group->id . ", eid:event.id}, function(data) {
        $('#edit-event-modal').modal('show').find('#edit-event-content').html(data);
    });

I’m rendering the edit event form with renderAjax. When the form is loaded, I see in Firefox dev tool that the following assets are fetched:

moment.js
daterangepicker.js
kv-widgets.js

So far so good, but the dropdowns don’t work. Are the assets being loaded properly? My first suspicion is that maybe the jquery .html(data) is not loading them correctly, but I’m not sure how else to populate the modal without it.

@kartikv