Javascript 基于输入中的值重新蚀刻完整日历事件

我有一个日历，可以从MySQL数据库获取事件，以获得现场工作许可。当页面打开时，事件从数据库中提取并添加到日历中

我想在日历中添加一个搜索工具，用户在其中的5个输入中输入文本，单击apply，日历将根据输入的条件获取事件

当页面打开时，事件的第一次获取使用通配符通过ajax查询DB，这不会产生任何问题。然后我调用FullCalendar removeEvents和refetchEvents方法以使用新值运行ajax，但不包括任何输入的文本，只使用原始值

下面是我的Javascript

$(document).ready(function(){

document.getElementById('left_nav').innerHTML = sessionStorage.getItem('left_nav');
document.getElementById('company').innerHTML = " " + sessionStorage.getItem('company');
document.getElementById('profile_image').innerHTML = sessionStorage.getItem('profile_image');

//Add value of inputs to variables
var select_project = $('#select_project').val();
var select_site = $('#select_site').val();
var select_area = $('#select_area').val();
var select_requester = $('#select_requester').val();
var select_line_manager = $('#select_line_manager').val();

var today = new Date();
var dd = today.getDate();
var m = today.getMonth()+1; //January is 0!
var yyyy = today.getFullYear();

today = yyyy+'/'+m+'/'+dd;

var popup_button;

$('#clear').click(function(e) {


})

$('#apply').click(function(e) {

    //Clear all events and refetch
    $('.fullcalendar-event').fullCalendar('removeEvents');
    $('.fullcalendar-event').fullCalendar('refetchEvents');
})

// Event colors
$('.fullcalendar-event').fullCalendar({
    header: {
        left: 'prev,next today',
        center: 'title',
        right: 'agendaWeek,agendaDay'
    },
    views: {
        week: {
            columnFormat: 'ddd D/M'
        },
        day: {
            columnFormat: 'dddd D/M'
        }
    },
    defaultDate: today,
    editable: false,
    eventOverlap: false,
    displayEventTime: false,
    height: 'auto',
    allDaySlot: false,
    defaultView: 'agendaWeek',
    events: {
        //Get events based on criteria with wildcards
        type: "POST",
        url: 'php_files/calender_php_files/populate_calender.php',
        data: {
            client_id: sessionStorage.getItem('client_id'),
            access_id: sessionStorage.getItem('access_id'),
            select_project: '%' + select_project + '%',
            select_site: '%' + select_site + '%',
            select_area: '%' + select_area + '%',
            select_requester: '%' + select_requester + '%',
            select_line_manager: '%' + select_line_manager + '%'
        }
    },
    eventRender: function (event, element) {
        var event_popover = element.popover({
            title: function () {
                return "<B>" + event.event_title + "</B>";
            },
            placement: 'auto',
            html: true,
            trigger: 'click',
            animation: 'true',
            content: function () {

                if (sessionStorage.getItem('access_id') > 1) {
                    if (event.event_status === 'Open') {
                        popup_button = "<div class='form-group text-center'>" +
                            "<button class='btn btn-primary btn-xs'><a style='color:white;' href='view_permit.php?permit_id="
                            + encodeURIComponent(event.event_number) + "'>View/Edit</a></button>" +
                            "<button style='margin-left: 8px;' class='btn btn-success btn-xs'><a style='color:white;' href='sign_on_permit.php?permit_id="
                            + encodeURIComponent(event.event_number) + "'>Sign On</button>" +
                            "<button style='margin-left: 8px;' class='btn btn-warning btn-xs'><a style='color:white;' href='clear_permit.php?permit_id="
                            + encodeURIComponent(event.event_number) + "'>Clear</button>" +
                            "</div>"
                    } else if (event.event_status === 'Cleared') {
                        popup_button = "<div class='form-group text-center'>" +
                            "<button class='btn btn-primary btn-xs'><a style='color:white;' href='view_permit.php?permit_id="
                            + encodeURIComponent(event.event_number) + "'>View</a></button>" +
                            "<button style='margin-left: 8px;' class='btn btn-danger btn-xs'><a style='color:white;' href='cancel_permit.php?permit_id="
                            + encodeURIComponent(event.event_number) + "'>Cancel</button>" +
                            "</div>"
                    } else if (event.event_status === 'Cancelled') {
                        popup_button = "<div class='form-group text-center'>" +
                            "<button class='btn btn-primary btn-xs'><a style='color:white;' href='view_permit.php?permit_id="
                            + encodeURIComponent(event.event_number) + "'>View</a></button>" +
                            "</div>"
                    }
                } else {
                    popup_button = "<div class='form-group text-center'>" +
                        "<button class='btn btn-primary btn-xs'><a style='color:white;' href='view_permit.php?permit_id="
                        + encodeURIComponent(event.event_number) + "'>View</a></button>" +
                        "</div>"

                }

                if (event.event_type === 'embargo') {

                    if (sessionStorage.getItem('access_id') > 1) {
                        return "<div>" +
                            "<b>Site: </b>" + event.event_site +
                            "<br />" +
                            "<b>Start: </b>" + moment(event.event_start_date).format('DD/MM/YYYY') + ", " +
                            moment(event.event_start_time, 'HHmmss').format('HH:mm') +
                            "<br />" +
                            "<b>End: </b>" + moment(event.event_end_date).format('DD/MM/YYYY') + ", " +
                            moment(event.event_end_time, 'HHmmss').format('HH:mm') +
                            "<br />" +
                            "<br />" +
                            "<div class='form-group text-center'>" +
                            "<button class='btn btn-primary btn-xs'><a style='color:white;' href='edit_site_embargo.php?embargo_id="
                            + encodeURIComponent(event.event_number) + "'>View/Edit</a></button>" +
                            "</div>" +
                            "</div>"
                    } else {
                        return "<div>" +
                            "<b>Site: </b>" + event.event_site +
                            "<br />" +
                            "<b>Start: </b>" + moment(event.event_start_date).format('DD/MM/YYYY') + ", " +
                            moment(event.event_start_time, 'HHmmss').format('HH:mm') +
                            "<br />" +
                            "<b>End: </b>" + moment(event.event_end_date).format('DD/MM/YYYY') + ", " +
                            moment(event.event_end_time, 'HHmmss').format('HH:mm') +
                            "<br />" +
                            "<br />" +
                            "<div class='form-group text-center'>" +
                            "<button class='btn btn-primary btn-xs'><a style='color:white;' href='edit_site_embargo.php?embargo_id="
                            + encodeURIComponent(event.event_number) + "'>View</a></button>" +
                            "</div>" +
                            "</div>"
                    }

                } else if (event.event_type === 'permit') {
                    return "<div>" +
                        "<b>Site: </b>" + event.event_site +
                        "<br />" +
                        "<b>Start: </b>" + moment(event.event_start_date).format('DD/MM/YYYY') + ", " +
                        moment(event.event_start_time, 'HHmmss').format('HH:mm') +
                        "<br />" +
                        "<b>End: </b>" + moment(event.event_end_date).format('DD/MM/YYYY') + ", " +
                        moment(event.event_end_time, 'HHmmss').format('HH:mm') +
                        "<br />" +
                        "<br />" +
                        popup_button +
                        "</div>"
                }
            },
            container: 'body'
        }).popover('show');
        $('body').on('click', function (e) {
            if (!element.is(e.target) && element.has(e.target).length === 0 && $('.popover').has(e.target).length === 0)
                element.popover('hide');
        });
    }
});
});  

$（文档）.ready（函数（）{
document.getElementById（'left_nav'）。innerHTML=sessionStorage.getItem（'left_nav'）；
document.getElementById（'company'）.innerHTML=“”+sessionStorage.getItem（'company'）；
document.getElementById（'profile_image'）。innerHTML=sessionStorage.getItem（'profile_image'）；
//为变量添加输入值
var select_project=$（'#select_project'）.val（）；
var select_site=$（'#select_site'）.val（）；
var select_area=$（'#select_area'）.val（）；
var select_requester=$（'#select_requester'）.val（）；
var select_line_manager=$（'#select_line_manager'）.val（）；
var today=新日期（）；
var dd=today.getDate（）；
var m=today.getMonth（）+1；//一月是0！
var yyyy=today.getFullYear（）；
今天=yyyy+'/'+m+'/'+dd；
var弹出按钮；
$（“#清除”）。单击（函数（e）{
})
$（“#应用”）。单击（函数（e）{
//清除所有事件并重新蚀刻
$（'.fullcalendar事件'）。fullcalendar（'removeEvents'）；
$（'.fullcalendar事件'）。fullcalendar（'refetchEvents'）；
})
//事件颜色
$（'.fullcalendar事件'）.fullcalendar({
标题：{
左：“上一个，下一个今天”，
中心：'标题'，
右图：“agendaWeek，agendaDay”
},
观点：{
周：{
列格式：“ddd D/M”
},
日期：{
列格式：“dddd D/M”
}
},
日期:今天,，
可编辑：false，
事件重叠：错误，
displayEventTime:false，
高度：“自动”，
全天时段：错，
defaultView:'agendaWeek'，
活动：{
//基于带有通配符的条件获取事件
类型：“POST”，
url:'php_files/calender_php_files/populate_calender.php'，
数据：{
client\u id:sessionStorage.getItem（'client\u id'），
access\u id:sessionStorage.getItem（'access\u id'），
选择项目：'%1！'+选择项目+'%2！'，
选择站点：'%1！'+选择站点+'%2！'，
选择区域：'%1！'+选择区域+'%2！'，
选择请求者：'%1！'+选择请求者+'%2！'，
选择线路管理器：'%1！'+选择线路管理器+'%
}
},
eventRender:函数（事件，元素）{
var event_popover=element.popover({
标题：功能（）{
返回“+event.event_title+”；
},
位置：'自动'，
是的，
触发器：“单击”，
动画：“真的”，
内容：功能（）{
if（sessionStorage.getItem（'access_id'）>1）{
如果（event.event_status==‘打开’）{
弹出按钮=“”+
"" +
"" +
"" +
""
}
}否则{
弹出按钮=“”+
"" +
""
}
如果（event.event_type===‘禁运’）{
if（sessionStorage.getItem（'access_id'）>1）{
返回“”+
“地点：“+event.event\u地点”+
“
”+
开始：“+时刻（事件。事件开始日期）。格式（'DD/MM/YYYY'）+”+
时刻（event.event\u start\u time，'HHmmss'）。格式（'HH:mm'））+
“
”+
结束：“+时刻（事件。事件结束日期）。格式（'DD/MM/YYYY'）+”+
时刻（event.event\u end\u time，'HHmmss'）。格式（'HH:mm'））+
“
”+
“
”+
"" +
"" +
"" +
""
}否则{
返回“”+
“地点：“+event.event\u地点”+
“
”+
开始：“+时刻（事件。事件开始日期）。格式（'DD/MM/YYYY'）+”+
时刻（event.event\u start\u time，'HHmmss'）。格式（'HH:mm'））+
“
”+
结束：“+时刻（事件。事件结束日期）。格式（'DD/MM/YYYY'）+”+
时刻（event.event\u end\u time，'HHmmss'）。格式（'HH:mm'））+
“
”+
“
”+
"" +
"" +
"" +
""
}
}else if（event.event_type===‘permit’）{
返回“”+
“地点：“+event.event\u地点”+
“
”+
开始：“+时刻（事件。事件开始日期）。格式（'DD/MM/YYYY'）+”+
时刻（event.event\u start\u time，'HHmmss'）。格式（'HH:mm'））+
“
”+
结束：“+时刻（事件。事件结束日期）。格式（'DD/MM/YYYY'）+”+
时刻（event.event\u end\u time，'HHmmss'）。格式（'HH:mm'））+
“
”+
“
”+
弹出按钮+
""
events: {
    //Get events based on criteria with wildcards
    type: "POST",
    url: 'php_files/calender_php_files/populate_calender.php',
    data: function() {
        return {
           client_id: sessionStorage.getItem('client_id'),
            access_id: sessionStorage.getItem('access_id'),
            select_project: '%' + select_project + '%',
            select_site: '%' + select_site + '%',
            select_area: '%' + select_area + '%',
            select_requester: '%' + select_requester + '%',
            select_line_manager: '%' + select_line_manager + '%'
        };
    }
},