Remote Data Binding Issue

3 posts, 0 answers
  1. UBALDI SI
    UBALDI SI avatar
    4 posts
    Member since:
    Jul 2013

    Posted 06 Dec 2017 Link to this post

    Hello,

    I try to load child nodes on parent's expansion with the data remote binding.
    But when i do like the exemple (https://demos.telerik.com/aspnet-mvc/treelist/remote-data-binding) My first level is correctly loaded but I can't expand them beacause there is no icon to do it on my treelist. See Screenshot there

    I got the same issue on your sample application. I runned your solution and there is no icon to expand parent also. See screenshot

    My current kendo version is 2017.2.504.545.

    Also, I found on the forum another user who has the same problem (https://www.telerik.com/forums/mvc-treelist-load-on-demand, see the end of the topic)

    There is my treelist view 

    @(Html.Kendo().TreeList(Model)
                .Name("hierarchyTreelist")
                .Toolbar(x => {
                    if (ViewBag.Mode == TypeArbo.MP.ToString())
                    {
                        x.Create().Text(" ");
                    }
                })
                .Editable(editable => editable.Mode("popup").TemplateName("HierarchyPopUpEditor"))
                .Sortable()
                .Filterable(ftb => ftb.Extra(false))
                .Resizable(true)
                .Scrollable(true)
                .ColumnMenu()
                .Columns(columns =>
                {
                    columns.Add().Field(e => e.Id).Hidden(true);
                    columns.Add().Field(e => e.Libelle);
                    columns.Add().Field(e => e.Code).Width(140);
                    columns.Add().Field(e => e.CodeParent).Width(140);
                    columns.Add().Field(e => e.CodeEtLibelleUbaldi).Width(200).Hidden(ViewBag.Mode == TypeArbo.Ubaldi.ToString());
                    columns.Add().Field(e => e.FamilleLogistiqueNom).Width(250).Hidden(ViewBag.Mode == TypeArbo.Ubaldi.ToString());
                    columns.Add().Field(e => e.IsActif).Template("#= IsActif ? 'Oui' : 'Non' #").Width(100);
                    columns.Add().Title("Attributs").Command(c =>
                    {
                        c.Custom().Click("AttributView").Text(" ").Name("btnEditHierarchyAttribut").ImageClass("glyphicon glyphicon-th-list").ClassName("btn btn-info");
                    }).Width(80);
                    if (ViewBag.Mode == TypeArbo.MP.ToString())
                    {
                        columns.Add().Command(c =>
                        {
                            c.CreateChild().Text(" ").ClassName("btn btn-success");
                            c.Edit().Text(" ").ClassName("btn btn-primary");
                            c.Custom().Click("MoveView").Text(" ").Name("btnMoveHierarchy").ImageClass("glyphicon glyphicon-move").ClassName("btn btn-warning");
                            c.Custom().Click("DeleteView").Text(" ").Name("btnDeleteHierarchy").ImageClass("k-i-trash").ClassName("btn btn-danger");
                        }).Width(250);
                    }
                })
                .DataSource(dataSource => dataSource
                    .Create(create => create.Action("Create", "Hierarchie"))
                    .Update(update => update.Action("Update", "Hierarchie"))
                    .Destroy(destroy => destroy.Action("Delete", "Hierarchie"))
                    .Read(read => read.Action("GetHierarchies", "Hierarchie",
                                      new { typeArbo = ViewBag.Mode, txtCode = Code, txtLibelle = Libelle, txtParent = CodeParent, txtFamLogi = FamLogi, rdblIsActif = IsActif }))
                    .Model(m =>
                    {
                        m.Id(f => f.Code);
                        m.ParentId(f => f.CodeParent);
                        m.Field(f => f.Libelle);
                        m.Field(f => f.IsActif);
                        m.Field(f => f.Description);
                        m.Field(f => f.URL);
                        m.Expanded(false);
                    })
                )
                .Events(e =>
                {
     
                    e.Edit("OnEdit");
                    e.Save("OnSave");
                })
    )

     

    And there my data controller action :

            public JsonResult GetHierarchies([DataSourceRequest] DataSourceRequest request,string id, TypeArbo typeArbo, string txtCode, string txtLibelle, string txtParent, string txtFamLogi, bool? rdblIsActif)
            {
     
                List<PIMHierarchy> list = new List<PIMHierarchy>();
     
                if (rdblIsActif != null)
                    list = hierarchyManager.GetByParams(txtCode, txtLibelle, txtParent, txtFamLogi, typeArbo)
                                      .Where(h => ((bool)rdblIsActif && h.IsActif || !(bool)rdblIsActif && !h.IsActif)).ToList();
                else
                    list = hierarchyManager.GetByParams(txtCode, txtLibelle, txtParent, txtFamLogi, typeArbo).ToList();
     
                TreeDataSourceResult result = result = list.ToTreeDataSourceResult(request,
                                                        e => e.Code,
                                                        e => e.CodeParent,
                                                        e => id != null ? e.CodeParent == id : e.CodeParent == string.Empty,
                                                        e => e
                                                    );
     
                return Json(result, JsonRequestBehavior.AllowGet);
    }

     

    Do you have any ideas where the problem is ? 

    Thank you for you time on that issue,

     

  2. Stefan
    Admin
    Stefan avatar
    1469 posts

    Posted 08 Dec 2017 Link to this post

    Hello, Jeremy,

    Thank you for the provided details.

    Based on the code and the screenshot I can assume that the issue occurs because the records do not have the hasChildren property or the property is not true. This will tell the TreeList that the item has children and it will set the arrow accordingly:



    https://docs.telerik.com/kendo-ui/framework/hierarchicaldatasource/overview#bind-hierarchicaldatasource-to-remote-service

    "The hasChildren Boolean property indicates whether a data item contains children that can be fetched from the server. You can either hard-code it, map it to another property, or compute it with a function, as demonstrated below."

    // hard-code that the item will always have children
    hasChildren: true
     
    // map the hasChildren property to the HasEmployees field, serialized from the server
    hasChildren: "HasChildren"
     
    // compute whether the given item will have children
    hasChildren: function(item) {
        return item.HasEmployees && item.RelatedDepartment;
    }

    I hope this is helpful.

    Regards,
    Stefan
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  3. UBALDI SI
    UBALDI SI avatar
    4 posts
    Member since:
    Jul 2013

    Posted 08 Dec 2017 in reply to Stefan Link to this post

    Hello Stefan,

    It works as expected ! I didn't see this property in the asp.net mvc documentation.

    Thank you for your quick answer.

Back to Top