在下拉列表的更改事件

时间:2017-04-11 09:12:59

标签: jquery model-view-controller fullcalendar

我有1个下拉列表,用于选择任务状态和一个按钮,所以我基本上想根据状态加载事件(新的,正在进行,已完成) 我已经实现了它,它可以完美地获取所有事件但不会在完整日历中呈现... 当我第一次点击完整日历时,它会显示所有事件..因为我给了事件:' GetAllEvents'它工作正常,但当我从下拉列表中更改值时,它不会呈现

HTML:

 <div class="form-group">
           @Html.DropDownListFor(model => model.Task_runsModel.status, db.getStatus(), "---Select---", new { id = "taskstatus", multiple = "multiple", @class = "form-control" })   
 </div>

  $('#taskstatus').multiselect({  
                 nonSelectedText: '- - -Select Status- - -',    
                    includeSelectAllOption: true,
                    maxHeight: 400,
                    dropUp: true,
                    buttonWidth: 180,
                    enableFiltering: true,
                    enableHTML: true,
                    buttonClass: 'btn small btn-primary',
                    templates: {
                    button: '<button type="button" class="multiselect dropdown-toggle" data-toggle="dropdown"><span class="multiselect-selected-text"></span> &nbsp;<b class="fa fa-caret-down"></b></button>',
                    ul: '<ul class="multiselect-container dropdown-menu"></ul>',
                    filter: '<li class="multiselect-item filter"><div class="input-group"><span class="input-group-addon"><i class="fa fa-search"></i></span><input class="form-control multiselect-search" type="text"></div></li>',
                    filterClearBtn: '<span class="input-group-btn"><button class="btn btn-default btn-white btn-grey multiselect-clear-filter" type="button"><i class="fa fa-times-circle red2"></i></button></span>',
                    li: '<li><a tabindex="0"><label></label></a></li>',
                    divider: '<li class="multiselect-item divider"></li>',
                    liGroup: '<li class="multiselect-item multiselect-group"><label></label></li>' }

           });    

     $('#taskstatus').change( function(){
            debugger;
            var events = 'GetProjectsBack';

            $('#calendar').fullCalendar( 'removeEventSource', events);
            $('#calendar').fullCalendar( 'addEventSource', events);         
            $('#calendar').fullCalendar( 'refetchEvents' );
        }).change();

控制器:

   [HttpGet]
    public JsonResult GetProjectsBack(string start, string end,GetDataToCalendarModel model)
    {
        var rows = (dynamic)null;
        var len_Status_Id  = 1;
        if (len_Status_Id != 0)
        {

            string date1 = startdate;
            string date2 = enddate;
            var ApptListForDate = LoadSelectedTasks(date1, date2, model);
            var eventList = from e in ApptListForDate
                            select new
                            {
                                id = e.Task_Run_Id,
                                status = e.status,
                                project_name = e.Project_Name,
                                title = e.Task_Name,
                                task_id = e.Task_Id,
                                project_id = e.Project_Id,
                                comment = e.comment1,
                                start = e.start_time,
                                end = e.end_time,
                                allDay = false,
                                username = e.UserName,

                                className = "label-important",
                            };
            rows = eventList.ToArray();


          }

        return Json(rows, JsonRequestBehavior.AllowGet);




    }

    public static List<Task_runsModel> LoadSelectedTasks(string start, string end,GetDataToCalendarModel calmodel)
    {
        string status = null;
        var len_Status_Id = 1;
        UsersContext db = new UsersContext();
       List<Task_runsModel> result = new List<Task_runsModel>();
       for(int j=0;j<len_Status_Id;j++)
       {


               status = "Completed";


            var sql = "SELECT * from task_runs where active = 1 AND  dead = 0 ANd status= '" + status + "' ";

            var data = Database.Open("DefaultConnection").Query(sql);


            foreach (var item in data)
            {
                Task_runsModel model = new Task_runsModel();
                model.UserId = Convert.ToInt32(item.UserId);
                model.Task_Id = Convert.ToInt32(item.Task_Id);
                model.Task_Run_Id = Convert.ToInt32(item.Task_Run_Id);
                model.Task_Name = (from i in db.ProjectTaskModels
                                   where i.Task_Id == model.Task_Id
                                   select i.Task_Name).FirstOrDefault();
                model.Project_Id = Convert.ToInt32(item.Project_Id);
                model.Project_Name = (from i in db.ProjectMasterModels
                                      where i.Project_Id == model.Project_Id
                                      select i.Project_Name).FirstOrDefault();
                model.status = item.status.ToString();

                model.start_time = (item.start_time).ToString("yyyy-MM-dd HH:mm:ss");
                model.end_time = (item.end_time).ToString("yyyy-MM-dd HH:mm:ss");
                model.comment1 = item.comment1.ToString();
                model.UserName = (from i in db.UserProfiles
                                  where i.UserId == model.UserId
                                  select i.UserName).FirstOrDefault();

                result.Add(model);
            }
        }

        return result;
    }

1 个答案:

答案 0 :(得分:0)

问题已经解决,我刚刚添加了一行$('。fc-event')。remove(); ,因此它将删除以前加载的日历事件,并根据下拉列表显示新事件

$('#taskstatus').change( function(){
            debugger;

           var myevents = 'GetProjectsBack';
           $('.fc-event').remove();
           $('#calendar').fullCalendar( 'removeEvents');
           $('#calendar').fullCalendar('removeEventSources'); 
           $('#calendar').fullCalendar( 'addEventSource', myevents);

        }).change();