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. Image for the cookie policy date

I'm using the ejTreeGid control with LoadOnDemand when I don't know if the node has children.

I'm using the ejTreeGid control with LoadOnDemand. When the node is initially loaded I may not know if it has children nodes or not. So on those nodes that I do not know if they actually have children I would like to call back to the server to see if it does. That works great other than it doesn't handle it on the client when the list returned is empty. Is there any way that I can handle that gracefully? On the client I currently just get the waiting popup.
vardataManager=newej.DataManager({
async:true,
url:"/app/DocumentManagement/GetDocMgtFoldersAsync"
});
$("#selectDocumentFolderDialog#treeGridContainer").ejTreeGrid({
dataSource:dataManager,
idMapping:"id",
parentIdMapping:"parentFolderId",
hasChildMapping:"hasChildren",
enableVirtualization:true,
treeColumnIndex:1,
enableLoadOnDemand:true,
enableCollapseAll:true,
isResponsive:true,
commonWidth:"550px",
sizeSettings:{width:"570px",height:"452px"},
columns:[
{field:"id",headerText:"FolderId",width:0},
{field:'folderName',headerText:'Folder Name'}
]
});

5 Replies

Punniyamoorthi Elangovan December 5, 2018 01:26 PM UTC

Hi Brian, 
Thank you for contacting Syncfusion support. 
We have checked your reported issue and code snippet. Can you please let us know if you have facing console error in your application and provide more details regarding this issue, it will be very helpful to provide the better solution. 
Regards, 
Punniyamoorthi 


BR Brian December 5, 2018 04:40 PM UTC

I do get a console error:
TypeError: Cannot read property 'length' of undefined

The orange highlight is where it errors in the minified js;

        t.TreeGrid.expandRowsonDemand = function(n, i, r) {
            var u = n, f = u.model, o = t.Query().select(u._fieldNamesToQuery), e = f.flatRecords, l = f.updatedRecords, h;
            if (u._isFromGantt)
                var c = t.Predicate(f.parentTaskIdMapping, t.FilterOperators.equal, i.item[f.taskIdMapping])
                  , s = f.taskIdMapping
                  , a = f.parentTaskIdMapping;
            else
                var c = t.Predicate(f.parentIdMapping, t.FilterOperators.equal, i.item[f.idMapping])
                  , s = f.idMapping
                  , a = f.parentIdMapping;
            if (i.isChildRetrieved)
                return i.expanded = !0,
                t.TreeGrid.sendExpandCollapseRequest(u, r),
                !0;
            if (u._trigger("actionBegin", r))
                return !0;
            o.where(c);
            u._waitingPopupObj.show();
            o.requiresCount();
            h = u.dataSource().executeQuery(o);
            h.done(t.proxy(function(n) {
                for (var w, o, y, l = n.result, b = l.length, a = [], v = [], p = [], c = e.indexOf(i), k = i.childRecords && i.childRecords.length, h = 0; h < b; h++)
                    u._isFromGantt ? (o = u._createGanttRecord(l[h], i.level + 1, i),
                    f.enableWBS && (w = i.WBS,
                    o.WBS = w + "." + (h + 1))) : o = u._createRecord(l[h], i.level + 1, i),
                    o.index = e.length + a.length,
                    i.childRecords.push(o),
                    (o.item[f.hasChildMapping] || u._assignedParendIDs.indexOf(o.item[s]) != -1) && (o.hasChildRecords = !0,
                    o.childRecords = [],
                    o.isChildRetrieved = !1,
                    u._allParentItems.push(o),
                    u._isFromGantt && (o.manualStartDate = o.startDate,
                    o.manualEndDate = o.endDate,
                    o.manualDuration = o.duration,
                    o.isAutoSchedule || u._updateManualParentItem(o, null, !0))),
                    o.item[s] && v.push(o.item[s]),
                    a.push(o),
                    p.push(l[h]);
                u._taskIds.splice.apply(u._taskIds, [c + 1, 0].concat(v));
                u._isFromGantt && f.ids.splice.apply(f.ids, [c + 1, 0].concat(v.toString().split(",")));
                e.splice.apply(e, [c + 1, 0].concat(a));
                u._isDataManagerUpdate && u._jsonData.splice.apply(u._jsonData, [c + 1, 0].concat(p));
                i.isChildRetrieved = !0;
                i.expanded = !0;
                y = {
                    recordIndex: c,
                    data: i,
                    requestType: "expandcollapse",
                    expanded: !0
                };
                r && (r.isExpandingParticularLevelParent || u._isInExpandCollapseAll) ? t.TreeGrid.expandMultipleRecordsonDemand(u, i, r, y) : (u._renderExpandedChildRecords(r),
                u._trigger("expanded", y))
            })).fail(t.proxy(function(n) {
                u._triggerFailureEvent(n, u)
            }))
        }


Punniyamoorthi Elangovan December 6, 2018 01:47 PM UTC

Hi Brian, 
Thank you for your update. 
We have checked your reported issue, but we are unable to reproduce the reported issue at our end. We have prepared the sample with details you have shared with us and we request you to revert us by modifying the sample based on your application along with the replication procedure. This would be helpful for us to serve you better. 
Regards, 
Punniyamoorthi 
 


BR Brian December 7, 2018 05:55 PM UTC

Thanks for you example. Turns out that the object I was returning from my controller was not in the same format as your example.

Jesus Arockia Sankaran S December 10, 2018 11:15 AM UTC

Hi Brian, 
 
Thank you for your update. 
 
We suggest you to provide the dataSource to the TreeGrid control in below format to overcome the reported issue.  
Code snippet: 
[CS] 
public List<SelfData> GetData() 
        { 
            List<SelfData> data = new List<SelfData>(); 
            data.Add(new SelfData() 
            { 
                Id = 1, 
                Name = "Parent", 
                StartDate = "02/23/2017", 
                Duration = 5, 
                PercentDone = 40, 
                hasChildren = true, 
                ParentId = null 
            }); 
            data.Add(new SelfData() 
            { 
                Id = 2, 
                Name = "Child Task 1", 
                StartDate = "02/23/2017", 
                Duration = 5, 
                PercentDone = 40, 
                ParentId = 1 
            }); 
 
            return data; 
        } 
 
public object UrlDataSource(Syncfusion.JavaScript.DataManager value) 
        { 
            IEnumerable data = GetData(); 
            DataOperations ds = new DataOperations(); 
 
            if (value.Where != null && value.Where.Count > 0) //Filtering 
            { 
                data = ds.PerformWhereFilter(data, value.Where, value.Where[0].Operator); 
            } 
            if (value.Search != null && value.Search.Count > 0) // Searching 
            { 
                data = ds.PerformSearching(data, value.Search); 
            } 
 
            var count = data.AsQueryable().Count(); 
            if (value.Sorted != null && value.Sorted.Count > 0) //Sorting 
            { 
                data = ds.PerformSorting(data, value.Sorted); 
            } 
 
            data = ds.PerformSkip(data, value.Skip);//Paging 
            if (value.Take != 0) 
                data = ds.PerformTake(data, value.Take); 
 
            return new { result = data, count = count }; 
 
 
        } 
 
Please get back to us if you require any further assistance on this. 
 
Regards, 
Jesus Arockia Sankaran S 

Loader.
Live Chat Icon For mobile
Up arrow icon