BuildRenderTree Export to Excel grid.

[Panagiotis Bernalis]

Hello,

I am trying to define theToolbarClickevent to Grid when rendered using the RenderBuilderTree concept.

Could you please provide me a code example?

Thank you.

[Rahul Narayanasamy]

Hi Panagiotis, 

Greetings from Syncfusion. 

Query: BuildRenderTree Export to Excel grid. - I am trying to define theToolbarClickevent to Grid when rendered using the RenderBuilderTree concept. Could you please provide me a code example? 

We have validated your query and you want to render the Grid and perform export action using RenderTreeBuilder concept. Here, we have prepared  a sample based on your requirement. We have rendered Grid and defined Grid events using RenderTreeBuilder concept. Find the below code snippets and sample for your reference. 

public class Comp<T> : SfGrid<T> 

    { 

        public void OnToolbarClick(Syncfusion.Blazor.Navigations.ClickEventArgs args) 

        { 

            if (args.Item.Id == "Grid_excelexport") 

            { 

                this.GridRef.ExcelExport(); 

            } 

        } 

        private SfGrid<T> GridRef { get; set; }    

        protected override void BuildRenderTree(RenderTreeBuilder builder) 

        {             

            builder.OpenComponent<SfGrid<T>>(0);                

            builder.AddAttribute(1, nameof(AllowPaging), true); 

            builder.AddAttribute(2, nameof(DataSource), DataSource); 

            builder.AddAttribute(3, "ChildContent", new RenderFragment(inner => 

            { 

                inner.OpenComponent<GridPageSettings>(5); 

                inner.AddAttribute(6, nameof(GridPageSettings.PageSize), Microsoft.AspNetCore.Components.CompilerServices.RuntimeHelpers.TypeCheck<System.Int32>(10)); 

                inner.CloseComponent(); 

 

                . . . 

 

                inner.OpenComponent<GridEvents<T>>(31); 

                inner.AddAttribute<Syncfusion.Blazor.Navigations.ClickEventArgs>(32, "OnToolbarClick", 

                    EventCallback.Factory.Create<Syncfusion.Blazor.Navigations.ClickEventArgs>(this, OnToolbarClick)); 

                inner.CloseComponent();   //defined GridEvents 

 

            })); 

            builder.AddAttribute(34, nameof(Toolbar), new List<string>() {"Add", "Edit", "Cancel", "Update", "ExcelExport" });   //defined grid toolbar 

            builder.AddAttribute(35, nameof(AllowExcelExport), true); 

            builder.AddAttribute(36, nameof(ID), "Grid");   //defined Grid ID 

            builder.AddComponentReferenceCapture(37, inst => { GridRef = (SfGrid<T>)inst; }); 

            builder.CloseComponent(); 

        } 

    } 

Sample: https://www.syncfusion.com/downloads/support/forum/162797/ze/DataGridRenderBuildTreeConcept-313109327  

Please let us know if you have any concerns. 

Regards, 

Rahul 

[Panagiotis Bernalis]

Hello,

Thank you for the reply and the sample, it works properly.

Could you provide me with additional information on how to implement a dropdownlist on the grid using BuildRenderTree?

Thank you.

[Rahul Narayanasamy]

Hi Panagiotis, 

Thanks for the update. 

We have validated your query and before proceeding this requirement, could you please share the below details.  

• Whether did you implement the Dropdownlist component in Grid using ColumnTemplate(For displaying the component in UI level – all time)?

https://blazor.syncfusion.com/documentation/datagrid/columns/#column-template 

Demo: https://blazor.syncfusion.com/demos/datagrid/column-template?theme=bootstrap4  

(Or)  

• Whether did you implement the Dropdownlist component in Grid using EditTemplate(For displaying the component while editing)?

https://blazor.syncfusion.com/documentation/datagrid/editing/#cell-edit-template,  

 

The provided information will be helpful to validate and provide a better solution. 

Regards, 

Rahul 

 

[Panagiotis Bernalis]

Hello,

Thanks for the reply.

I am trying to use the Blazor SfDropDownList control in Grid (Lookup Values) using EditTemplate when rendered using the RenderBuilderTree concept. Is it possible? 

Thank you.

[Rahul Narayanasamy]

Hi Panagiotis, 

Thanks for the update. 

Query: I am trying to use the Blazor SfDropDownList control in Grid (Lookup Values) using EditTemplate when rendered using the RenderBuilderTree concept. Is it possible? 

We have validated your query and you want to render SfDropdownList in EditTemplate of the Grid using RenderTreeBuilder concept. Here, we have prepared a sample based on your requirement.  Please find the below code snippets and sample for your reference. 

protected override void BuildRenderTree(RenderTreeBuilder builder) 

        {             

            builder.OpenComponent<SfGrid<T>>(0);                

            builder.AddAttribute(1, nameof(AllowPaging), true); 

            builder.AddAttribute(2, nameof(DataSource), DataSource); 

            builder.AddAttribute(3, "ChildContent", new RenderFragment(inner => 

            { 

                inner.OpenComponent<GridPageSettings>(5); 

                . . . 

 

                inner.OpenComponent<GridColumns>(12); 

                inner.AddAttribute(13, "ChildContent", (RenderFragment)((_builder1) => 

                { 

 

. . . 

                     

                    _builder1.OpenComponent(26, typeof(Syncfusion.Blazor.Grids.GridColumn)); 

                    _builder1.AddAttribute(27, "Field", Microsoft.AspNetCore.Components.CompilerServices.RuntimeHelpers.TypeCheck<System.String>("CustomerID")); 

                    _builder1.AddAttribute(28, "EditTemplate", (Microsoft.AspNetCore.Components.RenderFragment<System.Object>)((context) => (_builder2) => 

                    { 

                        _builder2.AddMarkupContent(29, "\r                "); 

                        _builder2.OpenComponent<Syncfusion.Blazor.DropDowns.SfDropDownList<string, Order>>(30); 

                        _builder2.AddAttribute(31, "ID", "CustomerID"); 

                        _builder2.AddAttribute(32, "DataSource",  

Microsoft.AspNetCore.Components.CompilerServices.RuntimeHelpers.TypeCheck<System.Collections.Generic.IEnumerable<Order>>( 

                            (IEnumerable<Order>)DataSource 

                            )); 

                        _builder2.AddAttribute(33, "Value", Microsoft.AspNetCore.Components.CompilerServices.RuntimeHelpers.TypeCheck<string>( 

                            (context as Order).CustomerID)); 

                        . . . 

                        _builder2.CloseComponent(); 

                        _builder2.AddMarkupContent(41, "\r            "); 

                    })); 

                    _builder1.CloseComponent(); 

                    _builder1.AddMarkupContent(42, "\r"); 

 

                })); 

                inner.CloseComponent(); 

 

                . . . 

 

            })); 

            . . . 

            builder.CloseComponent(); 

        } 

Sample: https://www.syncfusion.com/downloads/support/forum/162797/ze/DataGridSampleTreeBuilder-555487813  

Please let us know if you have any concerns. 

Regards, 

Rahul