Groups doesnt show in UI

[Johnny]

So here is my next issue:

When I add groups, the groups are not showing in the UI, they appear in the UI as though I havent set groups.

Any ideas why this might happen?

<RadDataForm [source]="baseCustomer" commitMode="OnLostFocus" >

<TKPropertyGroup tkDataFormGroups collapsible="true" name="Customer Contact Details" hidden="false">

<TKEntityProperty tkDataFormProperty name="customerName" displayName="Name" index="0" >
<TKPropertyEditor tkEntityPropertyEditor type="Text"></TKPropertyEditor>
</TKEntityProperty>

<TKEntityProperty tkDataFormProperty name="jobTitle" displayName="Job Title" index="1" >
<TKPropertyEditor tkEntityPropertyEditor type="Text"></TKPropertyEditor>
</TKEntityProperty>

<TKEntityProperty tkDataFormProperty name="telephoneNumber" displayName="Telephone Number" index="2" >
<TKPropertyEditor tkEntityPropertyEditor type="Text"></TKPropertyEditor>
</TKEntityProperty>

<TKEntityProperty tkDataFormProperty name="emailAddress" displayName="Email" index="3" >
<TKPropertyEditor tkEntityPropertyEditor type="Text"></TKPropertyEditor>
</TKEntityProperty>

</TKPropertyGroup>

<TKPropertyGroup tkDataFormGroups collapsible="false" name="Business Details" hidden="false">

<TKEntityProperty tkDataFormProperty name="companyName" displayName="Business Name" index="3" >
<TKPropertyEditor tkEntityPropertyEditor type="Text"></TKPropertyEditor>
</TKEntityProperty>

</TKPropertyGroup>

</RadDataForm>

 

[Johnny]

Sorry this is just in Android, havent tested iOS yet!

[Nick Iliev]

Hi Johnny Zen,

The reason for your PropertyEditos not to show in groups is because in the code snippet provided for each tkEntityProperty is used the tkDataFormProperty directive where it should be tkPropertyGroupProperties.

For example here is your code using tkPropertyGroupProperties directive

<RadDataForm [source]="baseCustomer" commitMode="OnLostFocus">
    <TKPropertyGroup tkDataFormGroups collapsible="true" name="Customer Contact Details" hidden="false">
        <TKEntityProperty tkPropertyGroupProperties name="customerName" displayName="Name" index="0">
            <TKPropertyEditor tkEntityPropertyEditor type="Text"></TKPropertyEditor>
        </TKEntityProperty>
        <TKEntityProperty tkPropertyGroupProperties name="jobTitle" displayName="Job Title" index="1">
            <TKPropertyEditor tkEntityPropertyEditor type="Text"></TKPropertyEditor>
        </TKEntityProperty>
        <TKEntityProperty tkPropertyGroupProperties name="telephoneNumber" displayName="Telephone Number" index="2">
            <TKPropertyEditor tkEntityPropertyEditor type="Text"></TKPropertyEditor>
        </TKEntityProperty>
        <TKEntityProperty tkPropertyGroupProperties name="emailAddress" displayName="Email" index="3">
            <TKPropertyEditor tkEntityPropertyEditor type="Text"></TKPropertyEditor>
        </TKEntityProperty>
    </TKPropertyGroup>

    <TKPropertyGroup tkDataFormGroups collapsible="false" name="Business Details" hidden="false">
        <TKEntityProperty tkPropertyGroupProperties name="companyName" displayName="Business Name" index="3">
            <TKPropertyEditor tkEntityPropertyEditor type="Text"></TKPropertyEditor>
        </TKEntityProperty>
    </TKPropertyGroup>
</RadDataForm>

Keep in mind that any not grouped property will show first and then the groups will show as well. (so basically you might need to group all your source properties if you want to avoid this behaviour).

Regards,
Nikolay Iliev
Telerik by Progress

[Johnny]

Thanks Nikolay. Getting caught out by my lack of understanding.

Thanks for explaining :)