Rank 1
In our application we are using angular 14 and the kendo control tree-list , our requirement is to set the focus on the next node after we delete any node . Is there any possible method or way out to set focus.
For example If we delete "BW Input Template" then focus should be set on "Report Template" (there can be any number of node in BW Input Template folder ) and same for any node within the folder if deleted then focus should set to next node within the folder also I need the focused node data.
The code sample and data is below
<kendo-treelist
class="kendo-treelist"
[kendoTreeListFlatBinding]="data"
#directive="kendoTreeListFlatBinding"
parentIdField="wrkdocParentoid"
idField="wrkdocOid"
kendoTreeListExpandable
kendoTreeListSelectable
[height]="1200"
[rowReorderable]="true"
(cellClick)="onCellClick($event)"
>
<kendo-treelist-rowreorder-column
[width]="25"
>
</kendo-treelist-rowreorder-column>
<kendo-treelist-column
[expandable]="true"
title="Name"
[width]="250"
>
<ng-template
kendoTreeListCellTemplate let-dataItem let-rowIndex="rowIndex"
>
<span class="k-icon k-i-folder" *ngIf="isFolder(dataItem)"></span>
<span> {{ getTemplateName(dataItem) }}</span>
</ng-template>
</kendo-treelist-column>
<kendo-treelist-column
field="wrkdocUdid"
title="ID"
[width]="140"
></kendo-treelist-column>
</kendo-treelist>
DATA set:
mockData: any[] = [{
wrkdocOid: 3,
wrkdocType: 'RootTemplateContainer',
wrkdocUdid: 'BuiltIn.RootContainer',
wrkdocDescription:
'an invisible built-in folder which contains all items that appear on the root level',
wrkdocUpdatedate: null,
wrkdocUpdatename: null,
wrkdocWrkxlsoid: null,
wrkdocParentoid: null,
wrkdocPosition: null,
wrkdocXmlfile: null,
fmwrkdoclans: [],
inverseWrkdocParento: [],
wrkdocParento: null,
},
{
wrkdocOid: 4,
wrkdocType: 'UnusedTemplateContainer',
wrkdocUdid: 'BuiltIn.UnusedContainer',
wrkdocDescription:
'an invisible built-in folder which contains all items that appear in the not-used list',
wrkdocUpdatedate: null,
wrkdocUpdatename: null,
wrkdocWrkxlsoid: null,
wrkdocParentoid: null,
wrkdocPosition: 1,
wrkdocXmlfile: null,
fmwrkdoclans: [],
inverseWrkdocParento: [],
wrkdocParento: null,
},
{
wrkdocOid: 5,
wrkdocType: 'Folder',
wrkdocUdid: 'BwTemplates',
wrkdocDescription: null,
wrkdocUpdatedate: '2010-03-03T09:42:15',
wrkdocUpdatename: null,
wrkdocWrkxlsoid: null,
wrkdocParentoid: 3,
wrkdocPosition: 0,
wrkdocXmlfile: null,
fmwrkdoclans: [],
inverseWrkdocParento: [],
wrkdocParento: null,
},
{
wrkdocOid: 52,
wrkdocType: 'Folder',
wrkdocUdid: 'BwIT100',
wrkdocDescription: null,
wrkdocUpdatedate: '2010-03-17T13:55:12',
wrkdocUpdatename: 'Basware system',
wrkdocWrkxlsoid: null,
wrkdocParentoid: 5,
wrkdocPosition: 0,
wrkdocXmlfile: null,
fmwrkdoclans: [
{
wrkdoclanWrkdocoid: 52,
wrkdoclanText: 'BW Input Templates',
wrkdoclanLanudid: 'EN',
wrkdoclanWrkdoco: null,
},
{
wrkdoclanWrkdocoid: 52,
wrkdoclanText: 'BW Syöttöpohjat',
wrkdoclanLanudid: 'FI',
wrkdoclanWrkdoco: null,
},
],
inverseWrkdocParento: [],
wrkdocParento: null,
},
{
{
wrkdocOid: 10200,
wrkdocType: 'Template',
wrkdocUdid: 'E_104',
wrkdocDescription: null,
wrkdocUpdatedate: '2023-01-13T12:56:10',
wrkdocUpdatename: 'Latvanen Henri',
wrkdocWrkxlsoid: 10124,
wrkdocParentoid: 4,
wrkdocPosition: 0,
wrkdocXmlfile: 20241,
fmwrkdoclans: [
{
wrkdoclanWrkdocoid: 10200,
wrkdoclanText: 'laskelma',
wrkdoclanLanudid: 'EN',
wrkdoclanWrkdoco: null,
},
{
wrkdoclanWrkdocoid: 10200,
wrkdoclanText: 'laskelma',
wrkdoclanLanudid: 'FI',
wrkdoclanWrkdoco: null,
},
],
inverseWrkdocParento: [],
wrkdocParento: null,
},
];
1 Answer, 1 is accepted
Hi Johina,
Thank you for the provided case details.
The developer can use the TreeList built-in methods, to focus a cell manually based on column and row indexes. For more details about the supported methods, please refer to the following article:
Before the cell is deleted the developer can store its row and column index. After deleting it, increase the row index with 1 and provide them to the focusCell method of the TreeList.
Give it a try and let us know how it goes.
Regards,
Martin
Progress Telerik