Team Sense: В календарь-расписание уроков добавлено разделение по преподавателям, которым присвоены свои цвета.

Team Sense: В календарь-расписание уроков добавлено разделение по преподавателям, которым присвоены свои цвета. Установление своего цвета для каждого преподавателя дало возможность визуально отличать уроки на общем календаре. А также сокращает время вникания кто есть кто.
  • На Dashboard возле каждого преподавателя можно видеть квадратик соответствующего цвета в календаре-расписании. При нажатии на него, либо ссылку "Расписание" попадёте на расписание этого сотрудника. Используется ЧПУ, то есть ссылки на расписание каждого сотрудника не динамические, а постоянные.
  • Переход через главное меню "Календарь" откроет ВАШ календарь, а не все, как было раньше. Это сделано для удобства, потому что даже расписание 3-х человек наслаивается так сильно, что сложно разобраться.
  • Над календарём - блок радиокнопок с выбором преподавателя, чьё расписание желаете посмотреть. Здесь происходит ajax выборка уроков определённого преподавателя.
  • Протестировано и работает в Chrome, Firefox, Opera, Safari.

Многопользовательский календарь Fullcalendar в CodeIgniter с разными цветами и выбором пользователей

Многопользовательский календарь Fullcalendar в CodeIgniter с разными цветами и выбором пользователей уже внедрён в Team Sense

P.S. Мы говорим в терминах преподаватели или учителя, но Team Sense можно успешно применять в более общих случаях сотрудники, сослуживцы в любом бизнесе.

Если вам интересен процесс разработки и поиска решений, то посмотрите поиски внедрения этой функциональности на stackoverflow.com. Приведу суть (потому что заметил, что через какое-то время вопросы там удаляются):

Как показывать события для нескольких источников eventSources в зависимости от выбраннных checkboxes в Fullcalendar.

I'm adding the feature like in Solgema Fullcalendar - http://plone.org/products/solgema.fullcalendar/releases/2.1.2 (selecting and showing events with checkboxes selection)
 
My eventSourses look like:
eventSources: [
            ...
            {
                url: '/admin_schedule/get_schedule_db_recurring_events_on_daysweek/',//"<?echo $data_path?>",
                type: 'GET',
                data: {sch_teacher_id: sch_teacher_id},
                backgroundColor: 'red',
            }

        ],
And I want implement checkboxes for "filtering" events by teachers, checked in checkboxes. For beginning make just one checkbox (later make foreach cover)
<div class="box">
        <?php
        $js = 'onClick="rerender_schedule()"';
        echo form_checkbox('teacher', 'vika', FALSE, $js)." Vika";  
        ?>
</div>
By this code as I think, fullcalendar must call rerender_schedule() function which filters data from eventSource with vika's sch_teacher_id
 
If somebody could help with rerender_schedule() function, I will be thankful, because not good in ajax.
 
EDIT: (thanks to tocallaghan!). It's just a beginning right now.
 
My 3 checkboxes:
    $data = array(
        'name'        => 'teacher',
        'class'       => 'teacher',
        'id'          => 'teacher',
        'value'       => '128',
        'checked'     => FALSE,
        'style'       => 'margin:10px',
        );
    echo form_checkbox($data); echo "Вика";  

    $data = array(
        'name'        => 'teacher',
        'class'       => 'teacher',
        'id'          => 'teacher2',
        'value'       => '111',
        'checked'     => FALSE,
        'style'       => 'margin:10px',
        );
    echo form_checkbox($data); echo "Вася"; 

    $data = array(
        'name'        => 'teacher',
        'class'       => 'teacher',
        'id'          => 'teacher3',
        'value'       => '1',
        'checked'     => FALSE,
        'style'       => 'margin:10px',
        );
    echo form_checkbox($data); echo "Саша";          
ajax on change them:
$('.teacher').change(function (event) {
events1.data.sch_teacher_id = $(this).val();
events2.data.sch_teacher_id = $(this).val();
events3.data.sch_teacher_id = $(this).val();
$calendar.fullCalendar('refetchEvents');
});
vars for eventSourses:
var events1 = { url: 'url1', type: 'GET', data: {sch_teacher_id: $('#teacher').val() }, success: function (response) { return response; } }; var events2 = { url: 'url2', type: 'GET', data: {sch_teacher_id: $('#teacher').val() }, backgroundColor: 'green', success: function (response) { return response; } }; var events3 = { url: 'url3', type: 'GET', data: { sch_teacher_id: $('#teacher').val() }, backgroundColor: 'red', success: function (response) { return response; } };
my eventSources call
eventSources: [ events1, events2, events3 ],

Ответ tocallaghan:

You need refetchEvents , but be careful to update you data parameter before calling (otherwise it will remain the initially set value)
$('.CheckBoxClass').change(function () {
    events.data.sch_teacher_id = $(this).val();
    $('#calendar').fullCalendar('refetchEvents');
});
Edit: code to declare events object:
var events = {
    url: 'url',
    type: 'GET',
    data: { Id: $('#divId').val() },
    success: function (response) {
        return response;
    }
};

$('#calendar').fullCalendar({
    events: events
});
 
tocallaghan, it becomes better, now ajax works good, but sch_teacher_id still old: $('.teacher').change(function (event) { event.sch_teacher_id = 128; $calendar.fullCalendar('refetchEvents'); }); – almix yesterday
   
   
it is not the event parameter you should be changing but rather a reference to the events object you created when initialising the fullcalendar. Assuming this is called "events" you should replace event.sch_teacher_id = 128 with events.data.sch_teacher_id – tocallaghan yesterday
   
   
It looks like you have created your event object anonymously, in order to reference it later on you need to create before you use it. Create an event object (var event = {url: 'url', type: 'Get'...}) and replace your {url: 'url', type: 'Get'...} with it – tocallaghan yesterday
 
tocalan, look, it's because in the beginning of view: $(document).ready(function() { var $calendar = $('#calendar'); ... var sch_teacher_id = "<?php echo $sch_teacher_id; ?>"; $calendar.fullCalendar({... so I think I set again value for sch_teacher_id from php: var sch_teacher_id = "<?php echo $sch_teacher_id; ?>"; But I can't assume it to be empty. – almix yesterday
 
when replace event.sch_teacher_id to events.data.sch_teacher_id, get error: ReferenceError: events is not defined [Break On This Error] events.data.sch_teacher_id = 128;//$(this).val(); – almix yesterday
 
But I use eventSources:[...] to generate events, tocalan. Do you suggest replace it with creating object (var event = {url: 'url', type: 'Get'...}) ? I don't understand how to implement var event at the time of using eventSources. – almix yesterday
1
up voted
see edit for further clarification. You should be able to use eventSources also, the key is that you declare the events object first then set up you fullcalendar object using it, you then have access to the events.data.whateverParamToChange from the change() function of the checkbox – tocallaghan yesterday
 
tocallan, thank you! You recomendation works. Could you see edit in my question? How merge 3 events into 1, 'cause really i have 20 events! – almix 23 hours ago

 

Источник: loco.ru

almix
Разработчик Loco, автор статей по веб-разработке на Yii, CodeIgniter, MODx и прочих инструментах. Создатель Team Sense.

Вы можете почитать все статьи от almix'а.



Другие статьи по этой теме:
Комментарии (0)     Подпишитесь на RSS комментариев к этой статье.

Leave a Comment

Fields with * are required.

Картинка с кодом валидации
Пожалуйста введите символы с картинки. Регистр букв неважен.