全日历过滤事件与选择
Posted
技术标签:
【中文标题】全日历过滤事件与选择【英文标题】:Fullcalendar filtrering events with select 【发布时间】:2018-03-04 14:15:35 【问题描述】:我想通过更改选择选项来过滤事件,但我不确定如何。请帮忙(我想澄清一下,这是我第一次使用 Json 和 FullCalendar)
例子:
控制器 cCalendar
public function geteventos()
$rut_usu = $this->input->post('rut_usu');
$r = $this->mCalendar->geteventos($rut_usu);
echo json_encode($r);
模型 mCalendar
public function geteventos($rut_usu)
$this->db->select('CONCAT(estudiantes.pnombre," ", estudiantes.apellido_pa," ", estudiantes.apellido_ma,", ",motivos_citas.descripcion_mot) As title ,citas.id_ci id, citas.fecha_ini start, citas.fecha_ter end');
$this->db->from('citas');
$this->db->join('estudiantes', 'citas.rut_estu = estudiantes.rut_estu');
$this->db->join('motivos_citas','citas.id_mot = motivos_citas.id_mot');
$this->db->join('usuarios','citas.rut_usu = usuarios.rut_usu');
$this->db->where('usuarios.rut_usu',$rut_usu);
return $this->db->get()->result();
$("#rut_usu").change(function()
rut_usu = $('#rut_usu').val();
$.post('<?php echo base_url();?>cCalendar/geteventos',
$('#calendar').fullCalendar(
header:
left: 'prev,next today',
center: 'title',
right: 'month,agendaWeek,agendaDay,listMonth'
,
defaultDate: new Date(),
navLinks: true, // can click day/week names to navigate views
businessHours: true, // display business hours
editable: true,
events: $.parseJSON(data)
);
));
【问题讨论】:
【参考方案1】:您的控制器和模态没有任何变化。 只修改js:
创建新的javascript函数:
function getEvents(rut_usu)
$('#calendar').fullCalendar( 'removeEvents');
$.ajax(
type:"GET",
url: "<?=base_url();?>cCalendar/geteventos",
dataType: 'json',
data: rut_usu:rut_usu ,
success: function(data)
$.each(data, function(index, event)
$('#calendar').fullCalendar('renderEvent', event);
);
);
在更改下拉事件中调用此函数:
<select id="rut_usu" OnChange="getEvents(this.value);">
-----
</select>
更改选择选项时渲染事件。
【讨论】:
以上是关于全日历过滤事件与选择的主要内容,如果未能解决你的问题,请参考以下文章
php 过滤事件日历的“自定义日期选择器开始日期”扩展名的minDate和maxDate。今天前7天到1个月前
php 过滤事件日历的“自定义日期选择器开始日期”扩展名的minDate和maxDate。今天前7天到1个月前