Intersoft Community - WebScheduler - Modify scheduler Day Header color

Modify scheduler Day Header color

Glayaar — Thu, 03 Jun 2010 23:43:18 GMT

Did you mean when user click on the modified header, the user will not be redirected to the day view? If so in the new DIV click event handler you will need to abort the click. Here is the snippet:

function ClickEventHandlerHeader(headerElem)
{    
    event.returnValue = false;
    event.cancelBubble = true;   
}

Modify scheduler Day Header color

srikantweb007 — Thu, 03 Jun 2010 08:17:44 GMT

Hi Glenn,

Thanks for the response. It is working. Can you please tell me how to prevent the click from the user. I mean when user clicked on the header no need to redirect them for newly created div.

Thanks

Srikant

Modify scheduler Day Header color

Glayaar — Wed, 02 Jun 2010 22:38:47 GMT

The issue could be replicated in my environment. This issue is caused because the clicked area is the newly added DIV, in order to resolve the issue, we will need to invoke the click event of the original area when we click the new DIV. You will need to add a new onclick event in the newly created DIV. Here is the snippet:

Listener.Add(headerElem[i], "onclick", ClickEventHandlerHeader, headerElem[i]);

During this click event handler, you will need to invoke the click for the original element, original snippet from this post:

var inProgress = false;
function ClickEventHandlerHeader()
{
    if (!inProgress)
    {
        inProgress = true;
        if (this.dispatchEvent)
        {
            var e = document.createEvent("MouseEvents");

            e.initEvent("click", true, true);
            this.dispatchEvent(e);
        }
        else
        {
            this.click();
        }
    }
    inProgress = false;
}

Modify scheduler Day Header color

srikantweb007 — Wed, 02 Jun 2010 06:10:55 GMT

Hi Glenn,

Thanks for your response. It is working fine for the day header color (on mouse over)

The snippet you provide there creating one more issue. In Week view when some one clicks on the day header the application redirected to Day view. But agter I applied the snippet , I got the redirection error.

When i clicked on the day header it throws an js error. Please find the attachment.

Can you please help on this.

Thanks

Srikant

Modify scheduler Day Header color

Glayaar — Mon, 31 May 2010 04:48:39 GMT

A user has created a new thread, Day header color changes on mouse over, in which he show a flaw with the provided snippet on Week view and Month view.

The thread also has a modified snippet in order to overcome the flaw.

Modify scheduler Day Header color

srikantweb007 — Wed, 19 May 2010 08:52:44 GMT

Hi Glenn,

Thanks for the response. Please ignore my previous post. I had found out a work wround to achieve the header color for quarter and year view.

Thanks

Srikant

Modify scheduler Day Header color

srikantweb007 — Wed, 19 May 2010 02:56:53 GMT

Hi Glenn,

Thanks for the response. It is working fine in month view. Can you please suggest a solutions for Quarter view and Year view.

Thanks

Srikant

Modify scheduler Day Header color

Glayaar — Tue, 18 May 2010 22:44:06 GMT

The snippet will modify the header color for all the date in month view, because the matching type in month view is set to 'MonthInboundDateHeader;MonthOutboundDateHeader;'

If you prefer only the current month is modified, please set the type in the month view to MonthInboundDateHeader;

Modify scheduler Day Header color

pwbriggs23 — Tue, 18 May 2010 11:26:50 GMT

Just got this from support and this works except for Month view where the 9th day is shown twice (current month and next month) and both get shaded. Asked another question if there is a way to indicate what month each 9th block is for or some difference between the blocks.

Hi,

For such scenario, you could use the OnAfterRenderView client side event handler in order to modify the header day element based on certain condition. Here is the snippet in order to modify the first date in every view to have a black background color with white color:

function WebScheduler1_OnAfterRenderView(controlId, viewMode)
{
    var sched = ISGetObject(controlId);
    var headerElem = null;
    var type = "";

    //Setting all date 1 to have black background color with white text
    switch (viewMode)
    {
        case "Day":
            headerElem = sched.GetDayDayHeader().getElementsByTagName('td');
            type = 'DayHeader;';
            break;
        case "Week":
            headerElem = sched.GetWeekDayHeader().getElementsByTagName('td');
            type = 'DayHeader;';
            break;
        case "Month":
            headerElem = sched.GetSchedulerTableFrame().getElementsByTagName('td');
            type = 'MonthInboundDateHeader;MonthOutboundDateHeader;';
            break;
        case "Quarter":
            headerElem = sched.GetSchedulerTableFrame().getElementsByTagName('td');
            type = 'YearDayOfWeek;';
            break;
        case "Year":
            headerElem = sched.GetSchedulerTableFrame().getElementsByTagName('td');
            type = 'YearDayOfWeek;';
            break;
    }

    for (var i = 0; i < headerElem.length; i )
    {
        if (type.indexOf(headerElem[i].getAttribute('type') ";") != -1 &&
                    headerElem[i].getAttribute('d') == '1')
        {
            headerElem[i].style.backgroundImage = "none";
            headerElem[i].style.backgroundColor = "Black";
            headerElem[i].style.color = "White";
        }
    }
}

Modify scheduler Day Header color

andi@intersoftpt.com — Tue, 18 May 2010 11:16:38 GMT

Hi Srikant,

What I meant is, at this moment, our WebScheduler only can edit the color for all days header. We cannot just set a different color for one particular day.

Thank you and have a nice day.

Best Regards,

Andi Santoso

Modify scheduler Day Header color

srikantweb007 — Mon, 17 May 2010 03:46:34 GMT

HI All,

I want to modify my scheduler header color. Ex. In a week view the day headers are 17 Monday, 18 Tuesday, 19 Wednesday, 20 Thursday etc... I want to modify the 18 Tuesday color(may be background color). How to modify the day header color ? Can any one help on this ?? thanks in advance..

Thanks

Srikant