Telerik Forums
UI for Blazor Forum
0 answers
6 views

Entering dates in the Blazor spreadsheet act weird if you enter a 2 digit year. It seems to subtract a day when you remove focus from the cell.

Start by entering a date like 2/2/25:

Then hit enter or otherwise remove focus from the cell and this is what it changes it to. Notice it subtracts a day:

Then put focus back on the cell:

Now look at the editor at the top:

I note that when you enter a two digit year in Excel it defaults the century to 20 when you enter a year less than 30. It defaults a century of 19 when you enter a year >= 30. It appears that with the Telerik Blazor spreadsheet it always defaults the century to 19. You can make arguments on either side of that but the real issue here is that it subtracts a day when you enter a two digit year. It doesn't do that when you enter a 4 digit year.

The related thing that becomes an issue is when you export the spreadsheet to a byte array and evaluate the cell RawValue. When you enter a 4 digit year, you get a raw value that is a positive number and you can use FormatHelper.ConvertDoubleToDateTime to get the date value. When you enter a 2 digit year and get the raw value, it is a negative number, and when you call FormatHelper.ConvertDoubleToDateTime it returns null.

Can you please comment on the rhyme or reason the spreadsheet behaves this way? Or is this a bug(s)?

Thanks.

Doug
Top achievements
Rank 1
Iron
Iron
Veteran
 asked on 27 Aug 2025
0 answers
8 views
How do I limit entry to just allow the MaxLength in the field?  Yes, I get an error when I enter 4000 characters in a field... but, why does it accept 4000 characters?  Is there a setting to limit/stop/truncate their entry?
Joel
Top achievements
Rank 3
Bronze
Iron
Iron
 updated question on 27 Aug 2025
0 answers
8 views

I'm using the TelerikTooltip (with tooltipposition: top) to wrap an icon on a page, so that when the icon is hovered, the tooltip appears. It appears that when the size of the page is such that the tooltip would overlap with the edge of the page, the tooltip adjusts its location. When it does so, it seems that telerik blazor initially attempts to place the callout (using css left) at the middlepoint of the tooltip, then corrects itself, and places the callout at the correct location above the item it is attached to. This shows visually as the callout appearing in one location, then flickering and appearing in another location. I have tried a few troubleshooting steps, including setting the css of the tooltip callout to left: unset, which worked perfectly on my local version of our application, but did not work once it was pushed to our application environment. In the local, this change made it so that the callout would not be placed in the midpoint initially but would skip that step and be correctly placed above the icon as desired. In the application environment however, it would put the callout at the leftmost point of the tooltip, and then do the same flickering, and then put it in the correct location. This makes me think that the issue could be solved if I could find a way to skip the step where it attempts to put the callout in the midpoint of the tooltip. However, I'm unable to find a way to make it do that.

My question is: is there a known workaround for this issue which I can use, or is this something that can be fixed by telerik? Or are there any suggestions of other things I can try, given that using "left: unset" in css was pretty close to working?

Here is the code used for the icon's razor file. 

<TelerikTooltip Class="infoIcon-tooltip" TargetSelector="@($"#{IconId}")" ShowOn="@TooltipShowEvent.Hover" Position="TooltipPosition.Top"></TelerikTooltip>
<span id="@IconId" class="infoIcon" title="@Title"/>

Here is the css used for the tooltip and its callout (which did not quite work correctly):


.infoIcon-tooltip .k-tooltip {
    background: var(--icon-tooltip-grey);
    border: 0.5px solid var(--icon-tooltip-grey);
    border-radius: 4px;
}

.infoIcon-tooltip .k-tooltip-content {
    font-family: Tenorite,sans-serif,Arial;
    font-size: 16px;
    word-wrap: break-word;
    width: -moz-fit-content;
    width: fit-content;
    height: -moz-fit-content;
    height: fit-content;
    color: white;
}


.infoIcon-tooltip .k-tooltip .k-callout {
    color: var(--icon-tooltip-grey);
    left: unset;
}

Christopher
Top achievements
Rank 1
 asked on 27 Aug 2025
0 answers
8 views
Hi Telerik Team,

While working with the DockManager component we encountered a few issues / potential improvements:

1. Inconsistent pane header height
   - When pane are in different visual states (headers displayed as a Tab vs. as a PaneHeader), their heights differ.  
   - Feature request: please consider introducing size enums (e.g. Small / Medium / Large) so that developers can adjust the header size. At the very least, making the heights consistent by default would help.

2. Last tab not transforming back to PaneHeader
   - When multiple panes are attached to the same field, they stack as tabs in a TabStrip.  
   - However, when only one pane remains(after any drag and drop to another field), it still stays inside the TabStrip instead of transforming back to the PaneHeader UI.  
   - Why is this the case? From a UX perspective, it would be more natural for the last tab to revert to the pane header style.

3. Conflicting CSS classes applied
   - When a pane is defined as follows:

<DockManagerContentPane HeaderText="@AppService.CurrentPageTitle"
                             AllowFloat="false"
                             Unpinnable="false"
                             Closeable="false"
                             Dockable="false">


   - The content area receives both k-pane-content AND k-tabstrip-content classes.  
   - This results in broken UI: double scrollbars, extra padding, and layout inconsistencies.

Screenshots attached for reference.
If something is not clear, feel free to ask, I would try to explain better =)

Thanks,
Regards,
Bohdan
Bohdan
Top achievements
Rank 2
Iron
Iron
 updated question on 27 Aug 2025
2 answers
13 views

Hi,

 

Is there a way to open a date picker component targeting the month of a future minimum date ?

For example, I have a minimum date in 3 months. When I open the date picker, the popup is focus on today. When I change the month or click on 'Today', the focus goes on the month of this future date as expected.

I would like to have this behavior when opening the popup.

I tried to use the NavigateTo() with the OnOpen() event but no luck.

REPL example : https://blazorrepl.telerik.com/cJYCGmlk51WrceTj48

 

Thanks in advance

Quentin
Top achievements
Rank 1
Iron
 answered on 27 Aug 2025
0 answers
6 views

Hi,

I'm using the carousel as a rotating dashboard.

Is it possible to only load the data when the controls become visible, and not all when the page loads.

Thanks

Nick

Nicholas
Top achievements
Rank 1
 asked on 27 Aug 2025
1 answer
8 views
I have a Grid with dynamic number of column (using ExpandoObject) and I want to create a custom row filter with a single text input field that uses a kind of simple wildcard logic I've already written, like "joh*" and so on. My question is how I call my wildcard method. I've started out with a FilterCellTemplate and TelerikTextBox where I can capture ValueChanged and I have access to the new value and the FilterCellTemplateContext. But how to continue? I've search the website without much success. Is it possible to call my wildcard logic from a custom FilterDescriptor?
Dimo
Telerik team
 answered on 26 Aug 2025
1 answer
13 views
Hi Telerik Team,

We are currently prototyping with TelerikAIPrompt.
We want to implement a conversation context feature, so I’m wondering how we can clear the output in order to load new data bound to another conversationId.

I only see an AddOutput method, but there doesn’t seem to be a way to remove or clear existing outputs.

Does this mean I should manually rewrite the OutputItemsTemplate and Views, etc... and manage my own collection instead of relying on the @context available inside the OutputItemTemplate?

I believe many people must have run into this issue, but I haven’t been able to find any related forum posts, knowledge-base articles, or demos.

Thanks!
Bohdan  
Tsvetomir
Telerik team
 answered on 22 Aug 2025
1 answer
15 views

When I call "Dialogs.AlertAsync", I get null reference error. Any reason why?  The whole page is under TelerikRootComponent.


<TelerikGrid Data="@availableSchedules" class="myTelerik-grid" SelectionMode="GridSelectionMode.Multiple"
             SelectedItems="@selectedSchedules"
             SelectedItemsChanged="@((IEnumerable<BTWInstructorAvailability> newSelected) => OnRowSelect(newSelected))"
             ScrollMode="GridScrollMode.Scrollable" Height="300px">
    <GridColumns>
        <GridCheckboxColumn CheckBoxOnlySelection="true" SelectAll="false" />
        <GridColumn Field="InstructorName" Title="Instructor Name" />
        <GridColumn Field="StartDate" DisplayFormat="{0:MM/dd/yyyy}" Title="Start Date" />
        <GridColumn Field="EndDate" DisplayFormat="{0:MM/dd/yyyy}" Title="End Date" />
        <GridColumn Field="Languages" Title="Languages" />
    </GridColumns>
</TelerikGrid>


protected async Task OnRowSelect(IEnumerable<BTWInstructorAvailability> newSelected)
{
    // Enforce max selection of 3
    if (newSelected.Count() > 3)
    {
        await Dialogs.AlertAsync("Maximum of 3 lessons can be selected.");
        return; 
    }

    selectedSchedules = newSelected;
}

Dimo
Telerik team
 answered on 21 Aug 2025
1 answer
16 views

I have a grid that is needs to use EditMode=GridEditMode.Incell.  I have a Telerik CheckBox defined under Template for  a GridColumn.  In order to prevent the need to click twice on the checkbox in the grid (click once to enter edit and click again to actually change the state of the checkbox to checked/unchecked), I have to set the GridColumn to Editable=false and then use OnChange to set the model value:

 <TelerikGrid @ref="@BookingEquipmentGridRef"
              Data="@BookingEquipmentList"
              EditMode="@GridEditMode.Incell"
              OnEdit="@OnEquipmentEdit"
              OnRowClick="@OnEquipmentRowClick"
              OnRowRender="@OnRowRenderHandler"
              OnUpdate="@OnEquipmentUpdate"
              OnStateInit="@((GridStateEventArgs<BookingEquipmentModel> args) => OnEquipmentGridStateInit(args))"
              Height="226px"
              Size="@ThemeConstants.Grid.Size.Small"
              SelectionMode="GridSelectionMode.Single"
              SelectedItems="@SelectedEquipmentList"
              FilterMode="GridFilterMode.FilterMenu"
              Resizable="true"
              Sortable="true"
              Reorderable="true"
              Pageable="true"
              EnableLoaderContainer="false"
              PageSize="25">
   <GridColumns>
                <GridColumn Field=@nameof(BookingEquipmentModel.IsChassis) Title="Chassis" Editable="false" Filterable="false" Width="5rem">
                    <Template>
                        @{
                            var bem = (BookingEquipmentModel)context;
                        }
                        <TelerikCheckBox Value="@bem.IsChassis" ValueExpression="@(() => bem.IsChassis)" ValueChanged="@((bool newValue) => OnChassisChanged(newValue, bem))" />
                    </Template>
                </GridColumn>

   </GridColumns>
</TelerikGrid>

Because I have to set Editable=false the OnEdit event is not fired so I no longer can use args.IsCancelled = true to prevent cell update. In my OnChassisChanged I can not assigned the value to the model but the visual state will no longer match.


    private Task OnChassisChanged(bool newValue, object item)
    {
        if (item == null) return Task.CompletedTask;

        BookingEquipmentModel selectedEquipmentModel = (BookingEquipmentModel)item;

        if (EditableState(SelectedBooking, selectedEquipmentModel) == BookingEquipmentState.EditableStatus.No) return Task.CompletedTask;

        selectedEquipmentModel.IsChassis = newValue;
        selectedEquipmentModel.IsEdit = true;
        DataState.State = DataState.States.UnSaved;

        return Task.CompletedTask;
    }

My users were complaining about having to click twice on a checkbox to set it's new state (checked or unchecked) ... and I agree with their issue, but I can't seem to find a solution (and keep using the TelerikCheckBox) ... any suggestions?

I seem to recall reading  another thread from some other user having similar problem, but seem unable to locate it again.

 

 

Dimo
Telerik team
 answered on 21 Aug 2025
Narrow your results
Selected tags
Tags
+? more
Top users last month
Jay
Top achievements
Rank 3
Iron
Iron
Iron
Benjamin
Top achievements
Rank 3
Bronze
Iron
Veteran
Radek
Top achievements
Rank 2
Iron
Iron
Iron
Bohdan
Top achievements
Rank 2
Iron
Iron
Richard
Top achievements
Rank 4
Bronze
Bronze
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Jay
Top achievements
Rank 3
Iron
Iron
Iron
Benjamin
Top achievements
Rank 3
Bronze
Iron
Veteran
Radek
Top achievements
Rank 2
Iron
Iron
Iron
Bohdan
Top achievements
Rank 2
Iron
Iron
Richard
Top achievements
Rank 4
Bronze
Bronze
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?