Jquery 完整日历问题 - 事件组和多个事件源的颜色

标签 jquery jquery-plugins fullcalendar

我正在查看 jquery full calendar 1.5,有几个问题。

多来源会是什么样子?

jQuery $.ajax options

You can also specify any of the jQuery $.ajax options within the same object! This allows you to easily pass additional parameters to your feed script, as well as listen to ajax callbacks:

    $('#calendar').fullCalendar({

        eventSources: [

            // your event source
            {
                url: '/myfeed.php',
                type: 'POST',
                data: {
                    custom_param1: 'something',
                    custom_param2: 'somethingelse'
                }
                error: function() {
                    alert('there was an error while fetching events!');
                },
                color: 'yellow',   // a non-ajax option
                textColor: 'black' // a non-ajax option
            }

            // any other sources...

        ]

    });

来自:http://arshaw.com/fullcalendar/docs/event_data/events_json_feed/

你会只放一个逗号,然后基本上复制第一个吗?

我的第二个问题是。我将有一个事件源(因为它们都来自同一源),但我将有一组事件,并且每组需要不同的颜色。

所以我可以拥有这个

Item 1 - group 1 (color red)
Item 2 - group 1 (color red)
Item 3 - group 2  (color green)
Item 4 - group 3 (color black)

现在这些颜色是由用户设置的,所以我永远不会知道第一个颜色组是什么。一位用户可能将其设置为红色,另一位用户可能将其设置为蓝色。

所以我认为我需要在每个事件中发送颜色。因此,项目 1 将具有与其关联的颜色,项目 2 将具有与其关联的颜色,等等。

如何做到这一点?我想一旦我恢复了事件,我就需要做点什么。我只是不确定什么。

谢谢

最佳答案

要处理多个源,你是对的,只需向 eventSources 数组添加更多内容即可:

$('#calendar').fullCalendar({

    eventSources: [

        // your event source
        {
            url: '/myfeed.php',
            type: 'POST',
            data: {
                custom_param1: 'something',
                custom_param2: 'somethingelse'
            }
            error: function() {
                alert('there was an error while fetching events!');
            },
            color: 'yellow',   // a non-ajax option
            textColor: 'black' // a non-ajax option
        },

        // your second event source
        {
            url: '/myfeed.php',
            type: 'POST',
            data: {
                custom_param3: 'somethingelseelse',
                custom_param4: 'somethingelseelseelse'
            }
            error: function() {
                alert('there was an error while fetching events!');
            },
            color: 'red',   // a non-ajax option
            textColor: 'white' // a non-ajax option
        }

        // any other sources...

    ]

});

就多个组的不同颜色而言,fullCalendar 只允许每个事件源使用一种颜色。因此,您必须为您拥有的每一组向 eventSource 添加一个源。至于让用户自定义他们的颜色,使用上面的例子,你可以有这样的东西:

$('#calendar').fullCalendar({

    eventSources: [

        // your event source
        {
            url: '/myfeed.php',
            type: 'POST',
            data: {
                custom_param1: 'something',
                custom_param2: 'somethingelse'
            }
            error: function() {
                alert('there was an error while fetching events!');
            },
            color: settings.customBackgroundColors(userId, groupX),   // a non-ajax option
            textColor: settings.customTextColors(userId, groupX) // a non-ajax option
        },

        // your second event source
        {
            url: '/myfeed.php',
            type: 'POST',
            data: {
                custom_param3: 'somethingelseelse',
                custom_param4: 'somethingelseelseelse'
            }
            error: function() {
                alert('there was an error while fetching events!');
            },
            color: settings.customBackgroundColors(userId, groupY),   // a non-ajax option
            textColor: settings.customTextColors(userId, groupY) // a non-ajax option
        }

        // any other sources...

    ]

});

<小时/> 编辑

如果您希望 json feed 中的每个事件具有单独的属性(例如单独的颜色),请执行以下操作。

public int id { get; set; }
public string title { get; set; }
public bool allDay { get; set; }
public string start { get; set; }
public string end { get; set; }
public string color { get; set; }
public string textColor { get; set; }

用您想要的颜色填充字符串,收集每个事件的颜色,然后将其发送回 json 结果,每个任务都应使用您在颜色属性中设置的任何内容。

关于Jquery 完整日历问题 - 事件组和多个事件源的颜色,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5601236/

相关文章:

jquery - css 选择器不是最后一个子元素不工作(需要纯 css 解决方案)

javascript - 当鼠标从子级悬停到父级时运行的 jquery 事件

javascript - jQuery 微醉插件。焦点触发不起作用

jquery - 限制全日历中事件之间的重叠

javascript - 通过 REST 从 Parse.com 检索 Fullcalendar 事件

javascript - 在 fullcalendar v4 事件中添加按钮

javascript - JSON.stringify 返回 []

javascript - 遇到循环不够迭代的问题

javascript - Dragdealer 初始化

javascript - 未捕获的类型错误 : Cannot read property 'className' of undefined dataTable