How to load Content Dinamically

[Carlos Lorenzo]

Hi,

I want to fill/load every AccordionItem's Content when expanding them, what's the best way to accomplish this?

Thanks,

[Alagumeena Kalaiselvan]

Hi Carlos, 

 

Greetings from Syncfusion Support. 

 

We have prepared a sample to meet your requirement using Expanding event which can be downloaded from the following link. 

 

https://www.syncfusion.com/downloads/support/forum/150299/ze/AccordionComponent-1603214139 

 

Please refer the code used in the sample. 

 

@using Syncfusion.EJ2.Blazor.Navigations 

 

<EjsAccordion @ref="AcrdnObj"> 

    <AccordionItems> 

        <AccordionEvents Expanding="OnExpand"></AccordionEvents> 

        <AccordionItem> 

            <HeaderTemplate> 

                <div>sample header1</div> 

            </HeaderTemplate> 

            <ContentTemplate>@FirstContent</ContentTemplate> 

        </AccordionItem> 

        <AccordionItem> 

            <HeaderTemplate> 

                <div>sample header2</div> 

            </HeaderTemplate> 

            <ContentTemplate>@SecondContent</ContentTemplate> 

        </AccordionItem> 

        <AccordionItem> 

            <HeaderTemplate> 

                <div>sample header3</div> 

            </HeaderTemplate> 

            <ContentTemplate>@ThirdContent</ContentTemplate> 

        </AccordionItem> 

    </AccordionItems> 

</EjsAccordion> 

 

@code{ 

    EjsAccordion AcrdnObj; 

    public RenderFragment FirstContent { get; set; } 

    public string SecondContent { get; set; } = ""; 

    public string ThirdContent { get; set; } = ""; 

    public void OnExpand(ExpandEventArgs args) 

    { 

        if (args.Index == 0) 

        { 

            FirstContent = builder => 

            { 

            builder.AddContent(1,@<Counter></Counter>); 

            }; 

        } 

        if (args.Index == 1) 

        { 

            SecondContent = "Sample Content Two"; 

        } 

        if (args.Index == 2) 

        { 

            ThirdContent = "Sample Content Three"; 

        } 

    } 

} 

 

Please try out the sample and get back to us for further assistance. 

 

Regards 

Alagumeena.K 

[Carlos Lorenzo]

Hi Alagumeena,

First of all, thanks for the quick answer.

Then, is there anyway of building the collection of AccordionItems dinamically as well? (without losing the ability to update every content template dinamically)

Thanks,

Carlos

[Alagumeena Kalaiselvan]

Hi Carols, 

Thanks for your update!. 

Currently, the requirement “Add collection of Items Dynamically” is not feasible with Blazor Accordion component. We have already considered this requirement as a feature request which can be tracked from the below link. It will be included in our upcoming volume 1, 2020 main release. We would appreciate your patience until then. 

https://www.syncfusion.com/feedback/10615/support-to-add-components-dynamically-as-accordion-item 

Regards, 

Alagumeena.K 

[Alagumeena Kalaiselvan]

Hi Carols, 

We are glad to announce that our Essential Studio 2020 Volume 1 release v18.1.0.42  is rolled out and is available for download under the following link. 

 

https://www.syncfusion.com/forums/152921/essential-studio-2020-volume-1-release-v18-1-0-42-is-available-for-download  

We thank you for your support and appreciate your patience in waiting for this release. Please get in touch with us if you would require any further assistance. 

 

Regards 

Alagumeena.K