We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on : Nov 16th 2018).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Programatically add holidays in Gantt control

Thread ID:

Created:

Updated:

Platform:

Replies:

119556 Jul 8,2015 09:59 AM UTC Jul 13,2015 04:24 PM UTC ASP.NET Web Forms 3
loading
Tags: Gantt
Rémi
Asked On July 8, 2015 09:59 AM UTC

Hi,

Here is my scenario :
I have a Calendar and I would like to dynamically add a holiday in the Gantt control each time I select a day in this Calendar.
I guess I should use Javascript but I can't find any documentation on ejGantt client-side programming. So I don't know which method to use to get ejGantt's holidays array and populate him with new records.

Can you show how to do this and can you link me, if possible, your components' client-side programming documentation ?

Thanks, Rémi.

Mahalakshmi Karthikeyan [Syncfusion]
Replied On July 9, 2015 09:19 AM UTC

Hi Remi,

Thanks for using Syncfusion product.

For your kind information, we can choose a date from calendar and add it to the existing Gantt holiday collection. Please find the below code snippet to add holiday dynamically,

<form id="form1" runat="server" //...>

   <ej:Gantt ID="Gantt" runat="server" //…>

        <Holidays>

            <ej:Holiday Label="holiday" Day="02/28/2014" BackGround="cyan" />

        </Holidays>

    </ej:Gantt>


    <ej:DatePicker ID="DatePicker" runat="server" ClientSideOnChange="dateChange"></ej:DatePicker>

</form>


<script type="text/javascript">


    function dateChange(args) {

        //Create Object for Gantt control

        var ganttobj = $("#Gantt").data("ejGantt"),

            //Create Object for Date picker

            dialogObj = $("#DatePicker").data("ejDatePicker"),

            date = args.value,

            holiday = {

                day: date,

                label: "Leave",

                background: "yellow"

            };

        var newHoliday = ganttobj.model.holidays;

        newHoliday.push(holiday);

        //To reset Holiday Collection

        ganttobj.option("holidays", newHoliday, true);

        ganttobj.updateScheduleDates(ganttobj.model.scheduleStartDate,               

                                     ganttobj.model.scheduleEndDate);

    }


</script>

As stated above we have created Gantt and DatePicker. In Datepicker change event we have added the selected date to the Gantt Holiday collection.

We have also prepared sample based on this and you can find the sample under the following location.

Sample

Please find our cliect side events documentation from the following link.

http://helpjs.syncfusion.com/js/api/ejgantt#events

Please let us know if you need further assistance on this.

Regards,

Mahalakshmi.


Rémi
Replied On July 10, 2015 07:31 AM UTC

Thanks, it works as expected. I just have a performance problem especially with IE8, this error message popup "a script on this page is causing your web browser to run slowly".

I'm new with Javascript, here is the code I'm using, do you see a way to avoid this error ?

function DateSelected(sender, eventArgs) {
            var ganttobj = $("#<%=EjGantt.ClientID%>").data("ejGantt")
            var date = eventArgs._renderDay._date;
            var year = date[0];
            var month = date[1];
            var day = date[2];
            date = month + "/" + day + "/" + year;
            var newHoliday = ganttobj.model.holidays;
            var holiday = {
                day: date,
                label: "",
                background: "#ffff99"
            };
            newHoliday.push(holiday);
            ganttobj.option("holidays", newHoliday, true);
            ganttobj.updateScheduleDates(ganttobj.model.scheduleStartDate, ganttobj.model.scheduleEndDate);
        };


Mahalakshmi Karthikeyan [Syncfusion]
Replied On July 13, 2015 04:24 PM UTC

Hi Remi,

Sorry for the inconvenience caused.

For your kind information, we can also reproduce the reported issue in IE8. Hence we have logged a issue report regarding this.

A support incident has been created under your account to track the status of this requirement. Please log on to our support website to check for further updates.

https://www.syncfusion.com/account/login?ReturnUrl=/support/directtrac/incidents

Please let us know if you require further assistance on this.

Regards,

Mahalakshmi K.


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

;