search envelope-o feed check
Home Unanswered Active Tags New Question
user comment-o

Event rendering different on Chrome

Asked by Kevin
5 years ago.

I am creating a complex calendar and for some reason the Daypilot Month events are rendering different in Chrome than Explorer and Firefox. I have added a .jpg of what I am referring to. In the .jpg, the far left is Chrome, the middle is Explorer, and the right is Firefox. As you can see, Firefox and Explorer render correctly. I dont know if this is a bug, a CSS error which I need to fix, or just all around weirdness by Chrome. Any ideas on how to fix?

Comment posted by Dan Letecky [DayPilot]
5 years ago.

If you are using custom sorting (EventSortExpression) this might be caused by different default sorting algorithms used by Chrome and the other browsers (e.g. "10" interpreted as a number vs string).

If you can post sample sorting values (or the whole .events.list array from the HTML source) it will help to narrow the issue.

Comment posted by Kevin
5 years ago.

I removed EventSortExpression because the query I run orders the way I want them to into the datatable. I would figure that the rows would populate just the way they become in the datatable. Here are the fields I poll:

ID - Int
Name - nvarchar
Date - Date
Order - char (A or B)
Time - nvarchar (AM or PM)

Running my query, here is a day that comes up in my query:

1 Brant Cooper 2013-05-01 A AM
2 Brooke Kyle 2013-05-01 B AM
3 Cristin Babcock 2013-05-01 A PM
4 Frederick Green 2013-05-01 B PM

Now in a secondary function, I go through and insert "Primary" and "Secondary" datarows which works well with explorer and firefox. The function I do that with is:

static private DataTable addOrder(DataTable dt, DateTime start)
{
int counter = 0;
int addDay = 0;

start = Convert.ToDateTime("5 / 1 / 2013");

//create table for format
DataTable formatted = new DataTable();
formatted.Columns.Add("Start", typeof(DateTime));
formatted.Columns.Add("End", typeof(DateTime));
formatted.Columns.Add("Subject", typeof(string));
formatted.Columns.Add("Id", typeof(string));

//create rows for primary and secondary
DataRow primary = formatted.NewRow();
primary["Subject"] = "Primary";
primary["Id"] = "ABC123";

DataRow secondary = formatted.NewRow();
secondary["Subject"] = "Secondary";
secondary["Id"] = "321CBA";

foreach (DataRow row in dt.Rows)
{
if (counter == 0)
{
primary["Start"] = start.AddDays(addDay).ToShortDateString();
primary["End"] = start.AddDays(addDay).ToShortDateString();
formatted.Rows.Add(primary.ItemArray);
formatted.ImportRow(row);
counter++;
}
else if (counter == 1)
{
formatted.ImportRow(row);
counter++;
}
else if (counter == 2)
{
secondary["Start"] = start.AddDays(addDay).ToShortDateString();
secondary["End"] = start.AddDays(addDay).ToShortDateString();
formatted.Rows.Add(secondary.ItemArray);
formatted.ImportRow(row);
counter++;
}
else if (counter == 3)
{
formatted.ImportRow(row);
counter = 0;
addDay++;
}
}

return formatted;
}

Then when they get placed I do some custom event graphics (colors/images). Is my thinking about how this is displayed wrong? As I said above, I figured it would be displayed the way it shows in the datatable.

Answer posted by Dan Letecky [DayPilot]
5 years ago.

If you don't use EventSortExpression it will be sorted using an equivalent of "start asc, end desc". If both event start and end are identical then the result is not guaranteed. It turns out that IE and FF implementation of Array.sort() doesn't change the order. But Chrome shuffles it...

So the only way to get a predictable result if the start and end dates are the same is to use EventSortExpression.

Comment posted by Kevin
5 years ago.

Thank you. After hearing that I added an "Order" column which I add manually. It works now!

This question is more than 6 months old and has been closed. Please create a new question if you have anything to add.