jQuery FullCalendar事件排序 [英] jQuery FullCalendar event sorting

查看:397
本文介绍了jQuery FullCalendar事件排序的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有很多活动都是全天活动,都是在同一时间开始的。我按照我希望它们出现在完整日历视图中的顺序创建事件,但它们似乎总是以其他方式排序。



如何获得事件是按字母顺序还是按ID排序?



编辑:添加示例数据数组。在日历中,我预计主管活动每天首先出现,按照字母顺序排列在Tech1和Tech2之前,并且其ID也比以下事件少一些。相反,我每天都会得到一个随机订单。



例如:

<2011年5月1日的订单显示为Tech2,Tech1,Tech1,Tech1 ,Tech2,主管。

2011-11-06当天显示为主管,Tech1,Tech1,Tech1,Tech2,Tech2。

我要求排序至少每天保持一致,理想情况下按字母顺序排列标题,或按照ID的顺序排列。

  var events = [
{id:1,title:'Supervisor',start:'2011-11-05T00:00:00-05:00 ',st_hours:10,ot_hours:0,allDay:true},
{id:2,title:'Tech2',start:'2011-11-05T00:00:00-05:00',st_hours: 10,ot_hours:0,allDay:true},
{id:3,title:'Tech2',开始:'2011-11-05T00:00:00-05:00',st_hours:10,ot_hours: 0,allDay:true},
{id:4,title:'Tech1',开始:'2011-11-05T00:00:00-05:00',st_hours:10,ot_hours:0,allDay: true},
{id:5,title:'Tech1',开始:'2011-11-05T00:00:00-05:00',st_hours:10,ot_hours:0,allDay:true},
{id:6,title:'Tech1',开始:'2011-11-05T00:00:00-05:00',st_hours:10,ot_hours:0,allDay:true},
{id:7,title:'Supervisor',start:'2011-11-06T00:00:00-05:00',st_hours:10,ot_hours:0,allDay:true},
{id:8 ,标题:'Tech2',开始:'2011-11-06T00:00:00-05:00',st_hours:10,ot_hours:0,allDay:true},
{id:9,title:' Tech2',开始:'2011-11-06T00:00:00-05:00',st_hours:10,ot_hours:0,allDay:true},
{id:10,title:'Tech1',start :'2011-11-06T00:00:00-05:00',st_hours:10,ot_hours:0,allDay:true},
{id:11,title:'Tech1',start:'2011- 11-06T00:00:00-05:00',st_hours:10,ot_hours:0,allDay:true},
{id:12,title:'Tech1',start:'2011-11-06T00: 00:00-05:00',st_hours:10,ot_hours:0,allDay:true}
];

编辑2:看来这个问题只存在于Google Chrome中。事件按照我预计他们在IE9和FF8中的顺序进行渲染。我开发的Chrome 15似乎是唯一受影响的浏览器。



Chrome

FireFox

解决方案

我发现chrome尊重开始时间。在构建活动时,我只需为列表中的每个项目添加一秒。在这个例子中,我有一个结果集,列中的每个特定日期的值。



在我的示例中,我执行以下操作:
$ b在列0中,标题在结果集中的列1中。 $ b

  var startVal =; 
$ .each(data.ResultSet,function(row)
title = data.ResultSet [row] [1];
startVal = new Date(data.ResultSet [row] [0] );
startVal.setSeconds(startVal.getSeconds()+ row);
start:startVal;



$ p $ b $ p
$ b

这样我就可以按照我放入事件对象的顺序显示标题。



在您的数据示例中,我将进行以下更改:

  var events = [
{id:1,title:'Supervisor',start:'2011-11-05T00:00:01-05:00',st_hours:10,ot_hours:0,allDay:true},
{id: 2,title:'Tech2',开始:'2011-11-05T00:00:02-05:00',st_hours:10,ot_hours:0,allDay:true},
{id:3,title: 'Tech2',开始:'2011-11-05T00:00:03-05:00',st_hours:10,ot_hours:0,allDay:true},
{id:4,title:'Tech1', start:'2011-11-05T00:00:04-05:00',st_hours:10,ot_hours:0,allDay:true},
{id:5,title:'Tech1',start:'2011 -11-05T00:00:05-05:00',st_hours:10,ot_hours:0,allDay:true},
{id:6 ,标题:'Tech1',开始:'2011-11-05T00:00:06-05:00',st_hours:10,ot_hours:0,allDay:true},
{id:7,title:'主管',开始:'2011-11-06T00:00:07-05:00',st_hours:10,ot_hours:0,allDay:true},
{id:8,title:'Tech2',start :'2011-11-06T00:00:08-05:00',st_hours:10,ot_hours:0,allDay:true},
{id:9,title:'Tech2',start:'2011- 11-06T00:00:09-05:00',st_hours:10,ot_hours:0,allDay:true},
{id:10,title:'Tech1',start:'2011-11-06T00: 00:10-05:00',st_hours:10,ot_hours:0,allDay:true},
{id:11,title:'Tech1',start:'2011-11-06T00:00:11- 05:00',st_hours:10,ot_hours:0,allDay:true},
{id:12,title:'Tech1',start:'2011-11-06T00:00:12-05:00' ,st_hours:10,ot_hours:0,阿迪:真}];

希望这有助于您!



/ p>

I have numerous events that are all day events, and all start at the same time. I create the events in the order I would like them to appear on the full calendar view, but they always seem to be sorted some other way.

How can I have the events sorted either alphabetically or by their id?

EDIT: Adding example Array of data. In the calendar, I expected that the Supervisor event would appear first each day, as alphabetically it is before Tech1 and Tech2, and its id is a lessor number than the following events as well. Instead, I get a random order each day.

eg:

day of 2011-11-05 the order displays as Tech2, Tech1, Tech1, Tech1, Tech2, Supervisor.

day of 2011-11-06 the order displays as Supervisor, Tech1, Tech1, Tech1, Tech2, Tech2.

I require that the sorting at least be consistent from day to day, and ideally be in either alphabetical order of the title, or in sequential order of the id.

var events=[
    {id:1, title:'Supervisor',start:'2011-11-05T00:00:00-05:00',st_hours:10,ot_hours:0,allDay:true},
    {id:2, title:'Tech2',start:'2011-11-05T00:00:00-05:00',st_hours:10,ot_hours:0,allDay:true},
    {id:3, title:'Tech2',start:'2011-11-05T00:00:00-05:00',st_hours:10,ot_hours:0,allDay:true},
    {id:4, title:'Tech1',start:'2011-11-05T00:00:00-05:00',st_hours:10,ot_hours:0,allDay:true},
    {id:5, title:'Tech1',start:'2011-11-05T00:00:00-05:00',st_hours:10,ot_hours:0,allDay:true},
    {id:6, title:'Tech1',start:'2011-11-05T00:00:00-05:00',st_hours:10,ot_hours:0,allDay:true},
    {id:7, title:'Supervisor',start:'2011-11-06T00:00:00-05:00',st_hours:10,ot_hours:0,allDay:true},
    {id:8, title:'Tech2',start:'2011-11-06T00:00:00-05:00',st_hours:10,ot_hours:0,allDay:true},
    {id:9, title:'Tech2',start:'2011-11-06T00:00:00-05:00',st_hours:10,ot_hours:0,allDay:true},
    {id:10, title:'Tech1',start:'2011-11-06T00:00:00-05:00',st_hours:10,ot_hours:0,allDay:true},
    {id:11, title:'Tech1',start:'2011-11-06T00:00:00-05:00',st_hours:10,ot_hours:0,allDay:true},
    {id:12, title:'Tech1',start:'2011-11-06T00:00:00-05:00',st_hours:10,ot_hours:0,allDay:true}
];

EDIT2: It appears this problem only exists in Google Chrome. Events render in the order I expect them to in both IE9 as well as FF8. Chrome 15, which I develop in, appears to be the only effected browser.

Chrome FireFox

解决方案

I found that chrome respects the start time. When building the event, I simply add a second to each item in the list. In the example, I have a resultset with each of the values for the specific date in columns. Start is in column 0, and title is in column 1 in the resultset.

In my example, I do the following:

var startVal = "";
$.each(data.ResultSet, function(row)
title = data.ResultSet[row][1];
startVal = new Date(data.ResultSet[row][0]);
startVal.setSeconds(startVal.getSeconds() + row);
start: startVal;

...

This way I have the title displayed in the order I put then into the event object.

In your data example, I would make the following change:

var events=[
{id:1, title:'Supervisor',start:'2011-11-05T00:00:01-05:00',st_hours:10,ot_hours:0,allDay:true},
{id:2, title:'Tech2',start:'2011-11-05T00:00:02-05:00',st_hours:10,ot_hours:0,allDay:true},
{id:3, title:'Tech2',start:'2011-11-05T00:00:03-05:00',st_hours:10,ot_hours:0,allDay:true},
{id:4, title:'Tech1',start:'2011-11-05T00:00:04-05:00',st_hours:10,ot_hours:0,allDay:true},
{id:5, title:'Tech1',start:'2011-11-05T00:00:05-05:00',st_hours:10,ot_hours:0,allDay:true},
{id:6, title:'Tech1',start:'2011-11-05T00:00:06-05:00',st_hours:10,ot_hours:0,allDay:true},
{id:7, title:'Supervisor',start:'2011-11-06T00:00:07-05:00',st_hours:10,ot_hours:0,allDay:true},
{id:8, title:'Tech2',start:'2011-11-06T00:00:08-05:00',st_hours:10,ot_hours:0,allDay:true},
{id:9, title:'Tech2',start:'2011-11-06T00:00:09-05:00',st_hours:10,ot_hours:0,allDay:true},
{id:10, title:'Tech1',start:'2011-11-06T00:00:10-05:00',st_hours:10,ot_hours:0,allDay:true},
{id:11, title:'Tech1',start:'2011-11-06T00:00:11-05:00',st_hours:10,ot_hours:0,allDay:true},
{id:12, title:'Tech1',start:'2011-11-06T00:00:12-05:00',st_hours:10,ot_hours:0,allDay:true}];

Hope this helps!

Ken

这篇关于jQuery FullCalendar事件排序的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆