在全日历时呈现事件

Question

我开始使用全日历，我有以下问题。我使用codeigniter将我的数据从php带入JSON，使用具有完整日历的"eventSources"函数将多个数据转换为JSON格式。现在我的问题是我需要应用属性"eventRender"，但只应用于我获得的数据之一，在这种情况下，我只想将其应用于"日历/get_alert"，但是我正在应用于所有人，以及某种方法可以改变它？我留下我拥有的代码。

<script type="text/javascript">
	 $(document).ready(function(){
		 $('#fullcalendar').fullCalendar({
		    header: {
	              left: 'title',
		      center: 'agendaDay,agendaWeek,month',
		      right: 'prev,next today'
		    },
			  editable: true,
			  firstDay: 1,
			  selectable: true,
			  defaultView: 'month',
			
			  eventSources: [
                           '<?= base_url() ?>calendar/get_alert',
                           '<?= base_url() ?>calendar/get_Sales',
                           '<?= base_url() ?>calendar/get_purchases'
                          ],
        
   
                          eventRender: function(event, element, view){
                            var el = element.html();
                            element.html("<div style='width:90%;float:left;'>" +  el + "</div><div style='text-align:right;' class='close'><span class='glyphicon glyphicon-trash'></span></div>");
                            element.find('.close').click(function(){
                             if(!confirm("Delete event?")){
                               return false;
                             }else{
                             var id = event.id;
                             $.post('<?= base_url() ?>calendar/delete_alert',
                             {
                                id:id
                             },
                             function(data){
                              if(data == 1)
                                alert('Successfully deleted');
                              else
                                alert('Error deleted');  
                             });
                              $("#fullcalendar").fullCalendar('removeEvents', event.id);
                  }         
              });             
          }   
		    });		
	    });
    </script>

新代码，每个网址的数据以JSON格式显示

<script type="text/javascript">
	 $(document).ready(function(){
		 $('#fullcalendar').fullCalendar({
		    header: {
	              left: 'title',
		      center: 'agendaDay,agendaWeek,month',
		      right: 'prev,next today'
		    },
			  editable: true,
			  firstDay: 1,
			  selectable: true,
			  defaultView: 'month',
			
			  eventSources: [
                            {
                             url: '<?= base_url() ?>calendar/get_alert',
                             customRender: true
                            },
                            {
                             url: '<?= base_url() ?>calendar/get_Sales',
                             customRender: false
                            },
                            {
                             url: '<?= base_url() ?>calendar/get_purchases',
                             customRender: false,
                            }
                            ],
        
   
                          eventRender: function(event, element, view){
                           if (event.customRender == true)
                            {
                            var el = element.html();
                            element.html("<div style='width:90%;float:left;'>" +  el + "</div><div style='text-align:right;' class='close'><span class='glyphicon glyphicon-trash'></span></div>");
                            element.find('.close').click(function(){
                             if(!confirm("Delete event?")){
                               return false;
                             }else{
                             var id = event.id;
                             $.post('<?= base_url() ?>calendar/delete_alert',
                             {
                                id:id
                             },
                             function(data){
                              if(data == 1)
                                alert('Successfully deleted');
                              else
                                alert('Error deleted');  
                             });
                              $("#fullcalendar").fullCalendar('removeEvents', event.id);
                  }         
              });  
            }           
          }   
		    });		
	    });
    </script>

Answer 1

一种简单的方法是这样的：

假设您为所有事件提供了一个额外的自定义布尔属性。例如，我们可以将其称为"customRender"，设置为 true 或 false。您可以将来自"get_alert"源的所有事件设置为具有render : true，而所有其他事件均为假。

例如，一个事件看起来像这样：

{
  start: "2017-01-01",
  end: "2017-01-03",
  //...other properties here...
  customRender: true
}

然后在 eventRender 方法中，只需将所有自定义逻辑包装在 if 语句中，以便它仅在事件将"customRender"设置为 true 时才运行：

eventRender: function(event, element, view) {
  if (event.customRender == true)
  {
    var el = element.html();
    element.html("<div style='width:90%;float:left;'>" +  el + "</div><div style='text-align:right;' class='close'><span class='glyphicon glyphicon-trash'></span></div>");
    //...etc
  }
}