This is a migrated thread and some comments may be shown as answers.

Duped TreeList Records

1 Answer 127 Views
TreeList
This is a migrated thread and some comments may be shown as answers.
Rajaraman
Top achievements
Rank 1
Rajaraman asked on 04 Aug 2017, 08:51 PM

1) I have the following code snippet from the Kendo Demo http://demos.telerik.com/kendo-ui/treelist/local-data-binding and included it in a chstml file

2) Tree List renders properly first time, when button is clicked second time, the earlier Tree List Data doesnt get refreshed. New DataSource gets appended to earlier one. 

3) using the following  Kendo UI Version   Kendo UI v2015.3.1111,  in AIG

4) Attached is Screenshot

5) you can reach out to me at rajaraman.soundarara@aig.com

Please help me resolve this issue at the earliest, since we are in middle of development

<script type="text/javascript">
    $(document).ready(function () {
        RefreshView();

        $("#refreshTree").click(function () {
            alert('button clicked');
            RefreshView();
        });
    });

    function RefreshView() {
        var dataSource = new kendo.data.TreeListDataSource({
            data: [
              { id: 1, Name: "Daryl Sweeney", Position: "CEO", Phone: "(555) 924-9726", parentId: null },
              { id: 2, Name: "Guy Wooten", Position: "Chief Technical Officer", Phone: "(438) 738-4935", parentId: 1 },
              { id: 32, Name: "Buffy Weber", Position: "VP, Engineering", Phone: "(699) 838-6121", parentId: 2 },
              { id: 11, Name: "Hyacinth Hood", Position: "Team Lead", Phone: "(889) 345-2438", parentId: 32 },
              { id: 60, Name: "Akeem Carr", Position: "Junior Software Developer", Phone: "(738) 136-2814", parentId: 11 },
              { id: 78, Name: "Rinah Simon", Position: "Software Developer", Phone: "(285) 912-5271", parentId: 11 },
              { id: 42, Name: "Gage Daniels", Position: "Software Architect", Phone: "(107) 290-6260", parentId: 32 },
              { id: 43, Name: "Constance Vazquez", Position: "Director, Engineering", Phone: "(800) 301-1978", parentId: 32 },
              { id: 46, Name: "Darrel Solis", Position: "Team Lead", Phone: "(327) 977-0216", parentId: 43 },
              { id: 47, Name: "Brian Yang", Position: "Senior Software Developer", Phone: "(565) 146-5435", parentId: 46 },
              { id: 50, Name: "Lillian Bradshaw", Position: "Software Developer", Phone: "(323) 509-3479", parentId: 46 },
              { id: 51, Name: "Christian Palmer", Position: "Technical Lead", Phone: "(490) 421-8718", parentId: 46 },
              { id: 55, Name: "Summer Mosley", Position: "QA Engineer", Phone: "(784) 962-2301", parentId: 46 },
              { id: 56, Name: "Barry Ayers", Position: "Software Developer", Phone: "(452) 373-9227", parentId: 46 }
             
            ],

            schema: {
                model: {
                    id: "id",
                    expanded: true
                }
            }
        });

        $("#treelist").kendoTreeList({
            dataSource: dataSource,
            height: 540,
            columns: [
                { field: "Position" },
                { field: "Name" },
                { field: "Phone" }
            ]
        });
    }
</script>
<div id="treelist"></div>
<button type="button" id="refreshTree">Click Me!</button>

1 Answer, 1 is accepted

Sort by
0
Georgi
Telerik team
answered on 08 Aug 2017, 11:51 AM
Hello Rajaraman,

The observed behavior occurs because the widget is created multiple times over the same element without being destroyed.

The following article illustrates how to initialize a widget on the same DOM element more than once:

I have modified the provided code in order to apply multiple initialization as explained in the above article:

http://dojo.telerik.com/ucObEv/6


Regards,
Georgi
Progress Telerik
Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Tags
TreeList
Asked by
Rajaraman
Top achievements
Rank 1
Answers by
Georgi
Telerik team
Share this question
or