We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Context in Template and EditTemplate differs? Can't retrieve related data.

Thread ID:

Created:

Updated:

Platform:

Replies:

150874 Jan 22,2020 04:47 PM UTC Jan 27,2020 03:59 AM UTC Blazor 3
loading
Tags: Grid
Michael Auerswald
Asked On January 22, 2020 04:47 PM UTC

I have a grid populated with Person objects, each of which has several many-to-many relations to other objects. I am reading this related data in the Template and it works. I am trying the exact same in the EditTemplate - and it does not. In particular, I can get the "item.Roles.Count" and it is correct. But everything after that is null. (so the actual related Role item).

The relation is Person.Roles (List) > PersonToRoles.Person // PersonToRoles.Role < Role

Again this works fine in the Template.

Version is 17.4.0.42

<EjsGrid DataSource="@Persons" ModelType="@Model" @ref="Grid" AllowPaging="true" Toolbar=@ToolbarItems AllowPdfExport="true" AllowExcelExport="true">
    <GridEvents OnToolbarClick="ToolbarClickHandler" TValue="Person"></GridEvents>
    <GridPageSettings PageSizes="@PageSizes"></GridPageSettings>
    <GridEditSettings AllowAdding="true" AllowEditing="true" AllowDeleting="true" Mode="EditMode.Normal"></GridEditSettings>
    <GridColumns>
        <GridColumn Field=@nameof(Person.Id) HeaderText="Person Id" IsPrimaryKey="true" TextAlign="TextAlign.Left" Width="50"></GridColumn>
        <GridColumn Field=@nameof(Person.Roles) HeaderText="Roles" TextAlign="TextAlign.Left">
            <Template>
                @{
                    var item = (context as Person);
                    var output = "";
                    if (item.Roles != null) {
                        for (int i = 0; i < item.Roles.Count; i++)
                        {
                            if (item.Roles[i].Role != null) {
                                output += item.Roles[i].Role.Name;
                                if(i < item.Roles.Count-1) output+=", ";
                            }
                        }
                        @output
                    }
                }
            </Template>
            <EditTemplate>
                @{
                    var item = (context as Person);
                    MultiValRoles = new string[]{};
                    string output = "";
                    if (item.Roles != null) {
                        for (int i = 0; i < item.Roles.Count; i++)
                        {
                            if (item.Roles[i].Role != null) {
                                output += item.Roles[i].Role.Name;
                                if(i < item.Roles.Count-1) output+=", ";
                                MultiValRoles.Append(item.Roles[i].Role.Name);
                            }
                        }
                        logger.LogInformation(output);
                    }

                    <EjsMultiSelect TValue="string[]" @bind-Value="@MultiValRoles" Placeholder="Roles" DataSource="@RoleList">
                        <MultiSelectFieldSettings Text="Name" Value="Name"></MultiSelectFieldSettings>
                    </EjsMultiSelect>
                }
            </EditTemplate> 
        </GridColumn>
    </GridColumns>
</EjsGrid>

Vignesh Natarajan [Syncfusion]
Replied On January 23, 2020 11:48 AM UTC

Hi Michael, 
 
Greetings from Syncfusion support  
 
Query: “I am trying the exact same in the EditTemplate - and it does not” 
 
From your query we understand that you want to display the value in Grid Column which has many to many relations. You have achieved this requirement using Column Template feature. But facing issue while trying to access the context inside EditTemplate. We have analyzed the your code example and found that you have used Append method to insert a string to String[] type. Hence the reported issue occur.   
 
But we are able to access the value inside the EditTemplate context also. We have prepared a sample as per your requirement (with many to many relation and MultiSelect control). We have considered the Name property inside Roles was a string type. Using OnActionBegin event we have saved the changes into the Grid data when RequestType is Save. Kindly refer the below code example.  
 
<EjsGrid DataSource="@Employees" Height="315"> 
    <GridEvents OnActionBegin="OnBegin" TValue="Person"></GridEvents> 
.. . . .. . . . . . . 
        <GridColumn Field=@nameof(Person.Roles) HeaderText="Roles" Width="200" TextAlign="TextAlign.Left"> 
            <Template> 
                @{ 
                    var item = (context as Person); 
.  . .. . . . . .  
                        } 
                        @output 
                    } 
                } 
            </Template> 
            <EditTemplate> 
                @{ 
                    var item = (context as Person); 
                    string output = ""; 
                    if (item.Roles != null) 
                    { 
                        for (int i = 0; i < item.Roles.Count; i++) 
                        { 
                            if (item.Roles[i].Childrens != null) 
                            { 
                                output += item.Roles[i].Childrens.Child; 
                                if (i < item.Roles.Count - 1) output += ", "; 
                            } 
                        }                        
                    }                     
                    <EjsMultiSelect @ref="MultiSelect" TValue="string[]" Value="@output.Split(",")" Placeholder="Roles" DataSource="@RoleList"> 
                        <MultiSelectFieldSettings Text="Child" Value="Child"></MultiSelectFieldSettings> 
                    </EjsMultiSelect> 
                } 
            </EditTemplate> 
. . . . . . . . .. . . ..  
</EjsGrid> 
 
@code{ 
    public List<Person> Employees { get; set; } 
    EjsMultiSelect<string[]> MultiSelect { get; set; } 
    public List<EmployeeName> Emp { get; set; } 
    public List<Name> RoleList { get; set; } 
    public void OnBegin(ActionEventArgs<Person> Args) 
    { 
        if(Args.RequestType == Syncfusion.EJ2.Blazor.Grids.Action.Save) 
        { 
               Update the values in datasource  
            Args.Data.Roles[0].Childrens.Child = String.Join(",",MultiSelect.Value); 
        } 
    } 
 
For your reference we have prepared a sample which can be downloaded from below  
 
 
Note: above sample is just a example to display, edit and save the changes in Grid data which has many to many relation properties. But it (sample) has some limitations like different updated value etc. We have provided the sample considered the Name property is of string type. If you are using different type, kindly get back to us with more details about your model class and datasource.   
 
 
Regards, 
Vignesh Natarajan. 


Michael Auerswald
Replied On January 24, 2020 01:52 PM UTC

Hi Vignesh,
thanks for your response. It was't exactly what I was looking for but it did put in me in the right direction in the end, so thanks :)
Michael


Vignesh Natarajan [Syncfusion]
Replied On January 27, 2020 03:59 AM UTC

Hi Michael,  
 
Thanks for the update.  
 
We are glad to hear that you are able to achieve your requirement.  
 
Kindly get back to us if you have any other queries.  
 
Regards, 
Vignesh Natarajan. 


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile
Live Chat Icon