Progress® Telerik® UI for Blazor Feedback Portal
Back to Feed
Request a Feature Report a Bug
Completed
Last Updated: 26 Jul 2019 08:25 by ADMIN
Release 1.4.0
nonick
Created on: 22 Jul 2019 13:23
Category: UI for Blazor
Type: Bug Report
1
TabStrip hides components
The tab strip hides animated components such as anything in the animation wrapper or date picker control if the content area of the tab strip is not already large enough. The tab strip should increase in size dynamically to accommodate this.
2 comments
ADMIN
Marin Bratanov
Posted on: 26 Jul 2019 08:23
Hi,

I tested the following snippet in the new 1.4.0 release and I see no issues with it, so I am marking this as resolved. Screenshots of what I see are attached at the end of the post.

If there are outstanding problems, please post an updated sample.

@using Telerik.Blazor.Components.TabStrip
@using Telerik.Blazor.Components.DropDownList
@using Telerik.Blazor.Components.DatePicker
@using Telerik.Blazor.Components.Window
 
<TelerikTabStrip TabPosition="Telerik.Blazor.Components.TabStrip.TabPosition.Left" @ref="myTabStrip">
    <TelerikTab Title="First">
        Click the third tab!
    </TelerikTab>
    <TelerikTab Title="Second" Disabled="true">
        Second tab content. This tab is disabled and you cannot select it.
    </TelerikTab>
    <TelerikTab Title="Third">
        <TelerikDropDownList Data="@myDdlData" TextField="MyTextField" ValueField="MyValueField" @bind-Value="selectedValue">
        </TelerikDropDownList>
 
        <br />Selected value: @selectedValue
 
        <TelerikDatePicker @bind-Value="datePickerValue" @ref="theDatePicker"></TelerikDatePicker>
 
        <br />The selected date is: @datePickerValue.ToShortDateString()
 
        <TelerikWindow Visible="true">
            <TelerikWindowTitle>
                <strong>The Title</strong>
            </TelerikWindowTitle>
            <TelerikWindowContent>
                This is my window <strong>popup</strong> content.
            </TelerikWindowContent>
        </TelerikWindow>
    </TelerikTab>
</TelerikTabStrip>
 
@code {
    Telerik.Blazor.Components.TabStrip.TelerikTabStrip myTabStrip;
 
        //in a real case, the model is usually in a separate file
    //the model type and value field type must be provided to the dropdpownlist
    public class MyDdlModel
    {
        public int MyValueField { get; set; }
        public string MyTextField { get; set; }
    }
 
    IEnumerable<MyDdlModel> myDdlData = Enumerable.Range(1, 20).Select(x => new MyDdlModel { MyTextField = "item " + x, MyValueField = x });
 
    int selectedValue { get; set; } = 3; //usually the current value should come from the model data
 
        DateTime datePickerValue { get; set; } = DateTime.Now;
 
    Telerik.Blazor.Components.DatePicker.TelerikDatePicker<DateTime> theDatePicker;
    // the type of the component depends on the type of the value
    // in this case it is DateTime, but it could be DateTime?
}


Regards,
Marin Bratanov
Progress Telerik UI for Blazor

Attached Files:
ADMIN
Marin Bratanov
Posted on: 22 Jul 2019 16:30
Hi,

We are working on detaching such popup/dropdown elements from the place of rendering to avoid clipping them. This will get fixed in a future version without the tabstrip having to change size.


Regards,
Marin Bratanov
Progress Telerik UI for Blazor
Create an account Log In
View
Type
Status
Category