Resources

Question

HiI am using ejs-gantt chart in asp.net core. how to allow editing for only one item in resources.i push extra items in resource tab.please check in below screenshot.i attached code file please check it.i request to you please resolve this issue as soon as possible.Issues  1. How can I allow edit true for UseQty  and other item allow editing false in resources tab. 2. how can put space between ItemNo,Quantity, and UseQty in resource tab. Attachment: Resource_ba8adb3c.zip

Monisha Sivanthilingam · Answer

Hi Himmat, 
 
Greetings from Syncfusion support. 
 
Please find the response for your queries. 
 




Sl.No. 

Query 

Syncfusion Comments 
 


1 

How can I allow edit true for UseQty  and other item allow editing false in resources tab. 

You can make use of the openEditDialog request type in the actionComplete event to set the allowEditing property of the columns as false. The following code snippets demonstrate the solution. 
 
Index.cshtml 




 
function actionComplete(args) { 
  if (args.action == "OpenDialog" && args.requestType == "openEditDialog") { 
     var tabObj = document.getElementById("Gantt_Tab").ej2_instances[0]; 
     tabObj.selected = function (args) { 
       if (args.selectedItem.innerText == "RESOURCES") { 
          var resourceTab = document.getElementById("GanttResourcesTabContainer_gridcontrol").ej2_instances[0]; 
          resourceTab.columns[3].allowEditing = false; 
          resourceTab.columns[4].allowEditing = false; 
          resourceTab.columns[5].allowEditing = false; 
        } 
      } 
   } 
} 
 
 
 


2 

how can put space between ItemNo,Quantity, and UseQty in resource tab. 

Similarly, you can use the openEditDialog dialog requestType in the actionComplete event to set the width of the columns. The following code snippets demonstrate the solution. 
 
Index.cshtml 




 
function actionComplete(args) { 
  if (args.action == "OpenDialog" && args.requestType == "openEditDialog") { 
     var tabObj = document.getElementById("Gantt_Tab").ej2_instances[0]; 
     tabObj.selected = function (args) { 
       if (args.selectedItem.innerText == "RESOURCES") { 
          var resourceTab = document.getElementById("GanttResourcesTabContainer_gridcontrol").ej2_instances[0]; 
          resourceTab.columns[4].width = "110px"; 
          resourceTab.columns[5].width = "110px"; 
          resourceTab.columns[6].width = "110px"; 
         } 
      } 
   } 
} 
 
 
 
 
 
We have also prepared a sample for your reference. 
 
Please contact us if you require any further assistance. 
 
Regards, 
Monisha. 1

Himmat Panchal · Answer

Hiabove you given code i put allowediting code in actionComplete function it's working proper. but when i did add code in actionComplete then selected checkbox not showing inside resource tab.please check below screenshots.﻿﻿screenshot of before not add code in actionComplete function. was showing selected item. 2. after add code in actioncomplete function.but not showing selected item. Attachment: ResourceItem_8f60c4ad.zip

Monisha Sivanthilingam · Answer

Hi Himmat, 
  
We were able to replicate the issue you reported. We will analyse it and provide you with further details within two business days(June 29, 2021). 
  
We appreciate your patience until then. 
  
Regards, 
Monisha.

Monisha Sivanthilingam · Answer

Hi Himmat, 
  
Our development team is currently validating your issue with high priority. We will provide you with further details tomorrow(July 1, 2021).  
  
We appreciate your patience until then.  
  
Regards,  
Monisha.

Monisha Sivanthilingam · Answer

Hi Himmat, 
 
Thank you for your patience. 
 
We have modified your sample to show the selected resources in the Resources tab. We have achieved this in the selected event of the tab in the dialog. We have taken the list of resources selected for a task and have selected those resources among all the resources in the Resources tab. The following code snippets demonstrate the solution. 
 
Index.cshtml 




 
function actionComplete(args) { 
        var ganttObj = document.getElementById("Gantt").ej2_instances[0]; 
        if (args.action == "OpenDialog" && args.requestType == "openEditDialog") { 
            var recordData = args.data; 
            var tabObj = document.getElementById("Gantt_Tab").ej2_instances[0]; 
            tabObj.selected = function (args) { 
                var id = args.selectedContent.childNodes[0].id; 
                if (id === ganttObj.element.id + 'ResourcesTabContainer') { 
                    var resourceTreeGrid_1 = ganttObj.element.querySelector('#' + id).ej2_instances[0]; 
                    var resources_1 = recordData.ganttProperties.resourceInfo; 
                    var currentViewData = resourceTreeGrid_1.getCurrentViewRecords(); 
                    if (resources_1 && resources_1.length > 0) { 
                        currentViewData.forEach(function (data, index) { 
                            for (var i = 0; i < resources_1.length; i++) { 
                                if (data.taskData[ganttObj.resourceFields.id] === resources_1[i][ganttObj.resourceFields.id] && 
                                    !ej.base.isNullOrUndefined(resourceTreeGrid_1.selectionModule) && 
                                    resourceTreeGrid_1.getSelectedRowIndexes().indexOf(index) === -1) { 
                                    resourceTreeGrid_1.selectRow(index); 
                                } 
                            } 
                        }); 
                    } 
                } 
            } 
        } 
    } 
 
 
We have prepared a sample for your reference. 
 
Please contact us if you require any further assistance. 
 
Regards, 
Monisha.