TreeList column name containing dot issue

[Cosmin]

Hi, we're currently using the TreeList and we've encountered an issue... while trying to edit a cell of a column named with a dot inside as "AR32.2" for example... the edit input doesn't show up

Could you help us with this case, please? :D 

Thank you,
Uscatu Cosmin

[Zornitsa]

Hi Cosmin,

Based on the provided screenshot I am unable to gather enough information regarding the experienced issue to figure out a possible cause of the behavior. Therefore, it would be great if you could share a more detailed explanation and a runnable example that reproduces the problem. This will help to identify the root of the issue and consequently provide further assistance on this matter. 

Nevertheless, since I noticed that you are utilizing in-cell editing of the TreeList component, below I am sharing some useful articles from our documentation that you may use to revise the edit mode configuration on your side: 

• Manual setup - https://www.telerik.com/kendo-angular-ui/components/treelist/editing/editing-in-cell/ 
• Built-in directive - https://www.telerik.com/kendo-angular-ui/components/treelist/editing/editing-directives/#toc-in-cell-editing-directive 

Thank you in advance for your cooperation. I am looking forward to your reply.

Regards,
Zornitsa
Progress Telerik

[Cosmin]

Hi :D 
Yeah, i'm using the in-cell edit mode :D i attach here my code samples... pretty much my cellClickHandler does the "sender.editCell(dataItem, columnIndex, this.createFormGroup(dataItem));" and later on my createFormGroup() method simply creates a FromGroup within a formControl named as each column :) my suspicion it's that maybe later on in your inner code you're using some statements to interrogate the formControl for the edited cell something like "formGroup.AR32.2.status" or something? :) so the dot from the column's name interferes perhaps within the js code? 

[Zornitsa]

Hi Cosmin,

The described issue emerges since Angular uses dotted syntax to resolve FormControls. This means that the control names in FormGroups cannot include dots as it will cause a conflict. There is more information regarding this matter in the following GitHub issue posted in the Angular repository: 

• https://github.com/angular/angular/issues/50608 

Here is also the pull request for the issue, which introduces a warning in the browser console with the Angular v17 release, when a dot is included in a FormGroup key:

• https://github.com/angular/angular/pull/50642 

Below you can find a StackBlitz example, in which this case is demonstrated and the warning can be observed when attempting to edit a cell in the TreeList component:

• https://stackblitz.com/edit/angular-ueyeoy 

I hope that the provided information is helpful. Let me know in case any further questions arise.

Regards,
Zornitsa
Progress Telerik

[Cosmin]

Thank you for the reply,
That was my thought, thanks for the clarification! :D 

Regards,
Uscatu Cosmin