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.
Unfortunately, activation email could not send to your email. Please try again.

Task progress depends on additional property

Thread ID:

Created:

Updated:

Platform:

Replies:

121635 Jan 11,2016 09:48 AM Jan 13,2016 12:44 PM JavaScript 4
loading
Tags: ejGantt
yaaami
Asked On January 11, 2016 09:48 AM

I add two non-default properties to Gantt data-source correctly, say, it is: (EstimationTime and ActualTime).
Now, I want to make task "progress" calculated and rendered in run-time depending on such equation: [("ActualTime" / "EstimationTime") * 100].
How would I do this? thank you.

Mahalakshmi Karthikeyan [Syncfusion]
Replied On January 12, 2016 02:03 AM

Hi Yaami,

Thanks for contacting Syncfusion Support.

We can calculate and render the task progress based on the custom column values using “queryCellInfo” client side event. Please refer the below code example for details.

<div id="gantt"></div> 

<script type="text/javascript">

var projectData = [

{

    //…

    ActualTime: "02/03/2014",

    EstimateTime: "03/07/2014",

//…

] }

$("#gantt").ejGantt({

                //…

                load:function(args){

                    var columns=this.getColumns();

                    var EstimateTime={

                        field:"EstimateTime",

                        mappingName:"EstimateTime",

                        headerText:"Estimate Time"

                    }

                    var ActualTime={

                        field:"ActualTime",

                        mappingName:"ActualTime",

                        headerText:"Actual Time"

                    }

                   columns.splice(3, 0, EstimateTime);

                    columns.splice(4, 0, ActualTime);

                },

                queryCellInfo: function (args) {                  

                    if (args.column.field == "status") {                        

                        var actDate = new Date(args.data.ActualTime);

                        var estDate = new Date(args.data.EstimateTime);

                        var calcValue = (actDate.getDate() / estDate.getDate()) * 100;

                        args.data.item[this.model.progressMapping] = Math.round(calcValue);

                        args.data.status = Math.round(calcValue);

                        $(args.cellElement).text(Math.round(calcValue));

                        var width = args.data.width * args.data.status / 100;

                        args.data.progressWidth = width;

                    }

                }

   });

</script>


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

Sample: http://jsplayground.syncfusion.com/30ggbe0t

Regards,

Mahalakshmi K.


yaaami
Replied On January 12, 2016 04:27 AM

Thank you very much. But when I edit a task ActualTime to be as EstimateTime, the task Progress will be 100% (or any value indeed), but its parent progress will still not updated!



yaaami
Replied On January 13, 2016 06:11 AM

OK. I developed this solution, but it needs more testing:

var editP = false;

$("#GanttContainer").ejGantt({
...
queryCellInfo: function (args) {
            if (args.column.field == "status") {
                updateTaskProgress(args.data, args.cellElement);
            }
        }
...
}

function updateTaskProgress(task, cell) {
    var actData = task.ActualTime;
    var estData = task.Duration;
    var calcValue = (actData / estData) * 100;
    var statusDelta = Math.round(calcValue) - getNum(task.status);
    task.status = getNum(task.status) + statusDelta; 
    task.item[this.model.progressMapping] = task.status;
    if (cell != null)
        $(cell).text(task.status);
    var width = task.width * task.status / 100;
    task.progressWidth = width;
    if (task.parentItem != null && editP) {
        updateParentsProgress(task.parentItem, statusDelta);
        editP = false;
    }
}
function updateParentsProgress(parent, statusDelta) {
    var childs = countArray(parent.childRecords, "isMilestone", false); // To exclude Milestones from subtasks count
    parent.status = getNum(parent.status) + Math.round(statusDelta / childs);
    parent.ActualTime = Math.round(parent.status / parent.Duration);
    parent.item[this.model.progressMapping] = parent.status;
    //$(parent.cellElement).text(parent.data.status);         *** Here I can't access parent cellElement
    var width = parent.width * parent.status / 100;
    parent.progressWidth = width;

    if (parent.parentItem != null)
        updateParentsProgress(parent.parentItem, statusDelta);
}

function countArray(array, prop, value) {
    var total = 0;
    for (var i = 0, len = array.length; i < len; i++)
        if (array[i][prop] === value) total++;
    return total;
}

function getNum(value) {
    return isNaN(value) ? 0 : value;
}

Mahalakshmi Karthikeyan [Syncfusion]
Replied On January 13, 2016 12:44 PM

Hi Yaami,

We couldn’t get the Parent task element at the time of child task editing. So we can use “refreshRow” public method to refresh the whole row of parent after its progress changed. Please refer the below code example for details.

function updateParentsProgress(parent, statusDelta, cell, editP) {

            //…

            var childs = countArray(parent.childRecords, "isMilestone", false); // To exclude Milestones from subtasks count

            parent.status = getNum(parent.status) + Math.round(statusDelta / childs);

            parent.ActualTime = Math.round(parent.status / parent.Duration);
            parent.item[this.model.progressMapping] = parent.status;
            //…

            if (editP) {

                editP = false;

                var args = {};

                args.recordIndex = parent.index;

                var ganttobj = $("#gantt").data("ejGantt");

                ganttobj.refreshRow(args);
            }
}

Please try with this code to update the parent and let us know if you have 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.

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.

;