javascript - 带有甜蜜警报 2 和完整日历的自动完成功能

Question

我正在尝试使用 fullcalendar 启动调度程序。单击日期时，会弹出一个对话框询问患者姓名，在键入名称时，搜索框将根据现有列表自动完成为简单起见，我创建了一个单独的 autocomplete.js 文件，其中包含自动完成选项（我的意图是最终从数据库中提取数据）

$( function() {
    var availableTags = [
      "ActionScript",
      "AppleScript",
      "Asp",
      "BASIC",
      "Scheme"
    ];
    $( "#tags" ).autocomplete({
      source: availableTags
    });
  } );

在主 html 中，以下是链接加上其他 jquery / bootstrap

<script src="../assets/js/demo.js"></script>
<script src="https://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>
<script src="../assets/js/autocomplete.js"></script>    
<script type="text/javascript">
     $(document).ready(function() {
       demo.initFullCalendar();
     });

在 demo.js

initFullCalendar: function(){
    $calendar = $('#fullCalendar');

    today = new Date();
    y = today.getFullYear();
    m = today.getMonth();
    d = today.getDate();

    $calendar.fullCalendar({
        viewRender: function(view, element) {
            // We make sure that we activate the perfect scrollbar when the view isn't on Month
            if (view.name != 'month'){
                $(element).find('.fc-scroller').perfectScrollbar();
            }
        },
        header: {
            left: 'title',
            center: 'month,agendaWeek,agendaDay',
            right: 'prev,next,today'
        },
        defaultDate: today,
        selectable: true,
        selectHelper: true,
         minTime: "07:00:00",
         maxTime: "21:00:00",
        views: {
            month: { // name of view
                titleFormat: 'MMMM YYYY'
                // other view-specific options here
            },
            week: {
                titleFormat: " MMMM D YYYY"
            },
            day: {
                titleFormat: 'D MMM, YYYY'
            }
        },
        select: function(start, end, allday) {
            // on select we show the Sweet Alert modal with an input
            swal({
                customClass: 'sidebyside',
                title: 'Create Patient Appointment',
                html: '<div class="form-group">' +
                        '<input class="form-control " placeholder="Facility" id="facility">' +
                    '</div>'+
                '<div class="form-group">' +
                        '<input class="form-control" placeholder="Provider" id="provider">' +
                    '</div>' +
                '<div class="form-group">' +
                        '<input class="form-control" placeholder="Complaint" id="starttime">' +
                    '</div>'+
                '<div class="form-group">' +
                   '<label for="Category">Select </label>' +
                   '<select class="form-control" id="category">' +
                   '<option>New Patient</option>' +
                   '<option>Review</option>' +
                   '<option>Referral</option>' +
                   '<option>Urgent Request</option>' +
                   '</select>' +
                '</div>' +
                '<div class="form-group">' +
    '<input class="form-control" type="text" label="label" id="start" value="Date Selected -' + start.format("dddd, MMMM Do YYYY") +  '" disabled/>'+
                   '</div>' +   
                   '<div class="ui-widget">' +
                   '<label for="tags">Tags: </label>' +
                   '<input id="tags"/>' +
                   '</div>',

                showCancelButton: true,

当我输入文本时，ui-widget 不会从 autocomplete.js 中提取

我错过了什么？

标签： javascriptjqueryfullcalendarsweetalert2