1. Home
  2. Forum
  3. Blazor
  4. Tab Component issues. (SelectedIndex, AddEventArgs)

Tab Component issues. (SelectedIndex, AddEventArgs)

Heeeeello~!


I am using many features of your Blazor product.

The content of this article is about Tab Component.

There are several issues with this.


I made an example for Issues. Please check the attached file.


Issue #1 :

When Tab Component is initialized, SelectedIndex becomes -1.

But I think the value of 0 is correct.


Issue #2 :

SelectedIndex is not working well.

Please following order.

1. Select "Tab 2".

2. Close "Tab 1".

3. At this time, SelectedIndex value does not change.


Issue #3 :

When "Tab Item" is added, the value of "AddEventArgs.AddedItems" which is an argument of the OnAddedTab event is null.

I don't think the "AddEventArgs.AddedItems" value should be null.


Thank you all the time for your support.

Cheers!

Attachment: SfBlazorSln_TAB__20210119_abcdc6a1.7z

4 Replies
SK Satheesh Kumar Balasubramanian Syncfusion Team January 19, 2021 09:02 AM UTC

Hi Jin, 
  
Greetings from Syncfusion Support..! 
  
Query 1: 
We have validated your reported query "When Tab Component is initialized, SelectedIndex becomes -1" at our end and found that _SelectedTabNum value is initialized as -1. So only SelectedIndex becomes -1, when Tab Component is initialized. 
  
Code snippet:  
    <div class="row"> 
        <div class="col-6"> 
            <SfButton CssClass="btn btn-primary" Content="Add Tab" @onclick="OnAddTabClick"></SfButton> 
        </div> 
        <div class="col-3"> 
            Selected Index : <input @bind-value="@_SelectedTabNum" /> 
        </div> 
        <div class="col-3"> 
            Selected Time : <input @bind-value="@_SelectedTabNumDt" /> 
        </div> 
    </div> 
  
@code { 
    private int _SelectedTabNum = 0; 
} 
  
Query 2: 
We have validated your reported query "SelectedIndex is not working well" at our end and suggest to use Tabs SelectedItem property to overcome this issue. 
  
Code snippet:  
            <SfTab @ref="CtrlControl" EnablePersistence="true" @bind-SelectedItem=_SelectedTabNum OverflowMode="OverflowMode.Scrollable" ShowCloseButton="true"> 
                <TabEvents Created="OnCreatedTab" Added="OnAddedTab" Removed="OnRemovedTab" Selected="OnSelectedTab"></TabEvents> 
                <TabAnimationSettings> 
                    <TabAnimationPrevious Effect="Syncfusion.Blazor.AnimationEffect.FadeOut"></TabAnimationPrevious> 
                    <TabAnimationNext Effect="Syncfusion.Blazor.AnimationEffect.FadeIn"></TabAnimationNext> 
                </TabAnimationSettings> 
            </SfTab> 
  
@code { 
     private int _SelectedTabNum = 0; 
    public async Task OnSelectedTab(SelectEventArgs args) 
    { 
        _SelectedTabNum = args.SelectedIndex; 
        _SelectedTabNumDt = DateTime.Now; 
    } 
} 
  
Query 3: 
We have validated your reported query "When "Tab Item" is added, the value of "AddEventArgs.AddedItems" which is an argument of the OnAddedTab event is null." at our end. We have confirmed this as a bug and and logged the defect report "AddedItems value is null in AddEventArgs" which can be tracked from the following link. 
The issue fix for this defect will be included in our upcoming release rolled out by the end of January 2021. We would appreciate your valuable patience until then. 
  
Please refer the modified sample. 
  
Kindly try the above sample and get back to us, if you need further assistance.  
   
Regards,   
Satheesh Kumar B  


JK jin kwang cheol January 20, 2021 01:19 AM UTC

Thank you very much for your quick reply.

Your reply differs from what I think.

First of all, since the initial SfTab.Items.Count is 0, the SelectedIndex should be the first -1.
But SfTab.SelectedItem is 0.
This is not common.

In my opinion, if Items.Count is 0 then SelectedItem should be -1.
Because so many controls in the world behave this way.

In this case, if AddTab is called, SelectedItem can be changed to 0. If you want make it.

Anyway, I got very important information in your reply.

If the user wants to get the SelectedItem (SelectedIndex) value,
That means... user have to use TabEvents's Added, Removed, Selected.

This isn't common, but it looks efficient in Blazor.
However, if you go deep, technically, that can be handled only by Selected Event. like others.

Cheers!

NR Nevitha Ravi Syncfusion Team January 20, 2021 10:10 AM UTC

Hi Jin, 
 
Thanks for your update. 
 
We have considered the reported case ‘SelectedItem should be -1 instead of 0 when no tab items’ as defect at our end and logged the bug report which can be tracked through the following link, 
 
The fix will be included in our weekly patch release scheduled on January 26, 2021 and would appreciate your patience until then. 
 
Regards, 
Nevitha 


NR Nevitha Ravi Syncfusion Team February 10, 2021 07:56 AM UTC

Hi Jin, 

Thanks for your patience. 

We have resolved the reported issue ‘AddItems value is null in AddEventArgs’ in our weekly patch release v18.4.39 and changed the SelectedItem value as -1 if there is no tab items in our last weekly patch release v18.4.42. So we request to upgrade the package to avail the fixes. 

Release Notes:  

Feedbacks: 

Please let us know if you need any further assistance. 

Regards, 
Nevitha 


Loader.
Up arrow icon