Add Tab pressing button

[Luca]

Hi, I would like to be able to add a tab (both header and content) after pressing a button, I can not find a way or an example.

my intent is to add a tab every time you open a link from the navigation bar.

I use essential js 2 for asp net core.
Thanks ,
Luca.

[Buvana Sathasivam]

Hi Luca,   

  

Thanks for using Syncfusion Products.   

  

We have rendered tab component with button.  If you click the button, it will add tab content and headers into the tab component using addTab public method.  If you wish to add a tab at a particular position, you can give an index argument(optional) into addTab method.  Please find the below code.   

  

Index.cshtml   

  

<button id="button" class="e-btn">Add Tab</button>   // Render button   

            <ejs-tab id="ej2Tab">   

                <e-tab-tabitems>   

                    <e-tab-tabitem header="ViewBag.headerText0" content="@content0"></e-tab-tabitem>   

                </e-tab-tabitems>   

            </ejs-tab>   

   

<script>   

        document.getElementById("button").onclick = function (e) {  // Triggered when click button   

            var obj = document.getElementById('ej2Tab').ej2_instances[0]; // Created object for tab   

            obj.addTab([{       

                header: { 'text': 'C++' },   

                content: 'C++ is a general-purpose programming language.'   

            }], 1)  // Specify the array of items and index(optional)   

        };   

    </script>   

  

For your convenience, we have prepared a simple sample with your requirement. Please the sample link on below.   

Sample: http://www.syncfusion.com/downloads/support/directtrac/209186/ze/EJ2_normalTab-917511880    

  

To know more about the Tab component members. Please refer to the below reference   

API: https://ej2.syncfusion.com/documentation/tab/api-tab.html?lang=typescript#addtab    

  

Regards,   

Buvana S