Telerik Forums
UI for Blazor Forum
1 answer
112 views

Hello,

we are currently evaluating Telerik for use in a new application. One major hurdle we are facing at the moment are key bindings. The application we are working on contains quite a bit of shortcuts as it aims at power users and key bindings are important for the efficiency of the workflows. The main component we are using is the TreeList, and one basic use case would be to expand and collapse all items in the TreeList with "*"/"-".

I read the forum articles about introducing keybindings to other components by wrapping the component in a div and using onkeydown on the div. That does not work with TreeList however (as I suspect the TreeList captures key events itself). I suspect using JS Interop might be the only option we have, but I just wanted to check if I am missing anything obvious.

Thank you,

Michael

Tsvetomir
Telerik team
 answered on 28 Jan 2025
1 answer
150 views
 

I have put an example where Field argument cannot fulfil what I need to do. 

The Column names and Field names are only discovered at runtime.

I can get the values to be displayed as I want using the <Template> element/component however I cannot grouping or sorting on these columns. 

<TelerikGrid Data="@simplePropertiescollection" Height="500px"
   Sortable="true" 
   Groupable="true"
   Resizable="true" 
   Reorderable="true">
   <GridColumns>
      <GridColumn Field="@(nameof(SimpleProperties.Name))" Title="Name" />
      @foreach (string prop in PropColumns)
      {
         <GridColumn FieldFunc = "(v) =>v.GetProps(prop)" Title="@prop">
            <Template>
               @{
                  // FieldFunc would replace the code below
                  string text = (context as SimpleProperties)?.GetProp(prop);
               }
               @text
            </Template>
         </GridColumn>
      }
   </GridColumns>
</TelerikGrid>

@code
{

   List<SimpleProperties> simplePropertiescollection = new List<SimpleProperties>();

   List<string> PropColumns { get; set; } = new();

   public class SimpleProperties
   {
      public string Name {get; set;} 

      public List<SimpleProperty?>? Properties { get; set; }

      public string? GetProp(string name)
      {
         return Properties.FirstOrDefault((SimpleProperty o) => o?.Name == name)?.Value;
      }
   }
   public class SimpleProperty
   {
      public string? Name { get; set; }

      public string? Value { get; set; }
   }
}


Dimo
Telerik team
 answered on 27 Jan 2025
0 answers
406 views

I use TelerikDateTimePicker and clients of my application send me a lot of issues with TelerikDateTimePicker.

1). If user types in values (date and time) quickly, user will be redirected to the end of input field e.g. type in year 2023 as fast as possible -> only one or two first digits will be filled, other digits will be typed in the end of the field




2) After user manually enters month, year is not selected automatically. Users want the same behaviour as we have with day, year, hours, minutes:




3)  After user finishes entering all valid values Date & Time and clicks outside the input field (TelerikDateTimePicker), all entered will be removed.

I use code like:

<label for="selected-date">
    TelerikDateTimePicker for enter Date and Time
</label>
<TelerikDateTimePicker 
    @bind-Value="@SelectedTime"
    Min="@Min" Max="@Max"
    Format="dd MMM yyyy HH:mm 'Z' (UTC)"
    Placeholder="dd MMM yyyy HH:mm 'Z' (UTC)"
    Id="selected-date"/>


@code {
    DateTime? SelectedTime = null;
    DateTime Min { get; set; } = new(1900, 1, 1, 0, 0, 0);
    public DateTime Max { get; set; } = new(2099, 12, 31, 23, 59, 59);
}


I also tried to use some combinations of TelerikDateTimePicker properties:

AllowCaretMode="true"
AutoCorrectParts="true"
AutoSwitchParts="true"

but this only made the behaviour worse

Alexey
Top achievements
Rank 1
Iron
Iron
 updated question on 27 Jan 2025
1 answer
189 views

Hi, as you can see from the sample below, i would like to edit a cell from row click (in addition to click on the editable cell), but if i click on the row (in other column who is not editable) the edit start and immediately stop.

How to solve?

In addition i would like to have the editing row selected

Thanks

https://blazorrepl.telerik.com/cTObGvvb54Hji0uL20

Dimo
Telerik team
 answered on 23 Jan 2025
1 answer
186 views

Hi,

I upgrades a Blazor Projekt from net 6, Blazor 3.7 to net 8, Blazor 7.1.
I handled all breaking changes, so it works now.
There is only an issue with the legend style : in 3.7 only the line is shown. But in 7.1 a dot with line.
The code of my chart control was not changed from 3.7 to 7.1.


<TelerikChart Height="200px">
    <ChartPlotArea Background="#FAFAFA"></ChartPlotArea>
    <ChartTooltip Visible="true"></ChartTooltip>
    <ChartSeriesItems>
        <ChartSeries Type="ChartSeriesType.Scatter" Name="@($"{AxleNumber}: {right_text}")" Data="@chartRight" Color="#ff8400"
                     XField="@nameof(ChartDataViewModel.start)"
                     YField="@nameof(ChartDataViewModel.Indicator)" Visible="@right_visible">
            <ChartSeriesMarkers Type="ChartSeriesMarkersType.Circle" Size="4" Background="#ff8400" />
        </ChartSeries>
        <ChartSeries Type="ChartSeriesType.Scatter" Name="@($"{AxleNumber}: {left_text}")" Data="@chartLeft" Color="#0071ff"
                     XField="@nameof(ChartDataViewModel.start)"
                     YField="@nameof(ChartDataViewModel.Indicator)" Visible="@left_visible">
            <ChartSeriesMarkers Type="ChartSeriesMarkersType.Circle" Size="4" Background="#0071ff" />
        </ChartSeries>
    </ChartSeriesItems>
    <ChartYAxes>
        <ChartYAxis Max="YAxis_Max" Min="YAxis_Min" />
    </ChartYAxes>
    <ChartXAxes>
        <ChartXAxis Type="date" BaseUnit="days">
            <ChartXAxisLabels Format="{0:dd.MM.yy}"></ChartXAxisLabels>
        </ChartXAxis>
    </ChartXAxes>
    <ChartLegend Position="ChartLegendPosition.Custom" OffsetX="50" OffsetY="10" Height="10" Visible="@(right_visible && left_visible)" />
</TelerikChart>


How can I get back to old Legend style?

Peter



Tsvetomir
Telerik team
 answered on 21 Jan 2025
0 answers
117 views

I don't understand what is going on.  I am sure I am missing something obvious.  

 

I am trying to setup my first Gantt Chart.   It is my understanding that this is setup in 2 pieces. The tree and timeline.   I am able to load the tree.  It comes up and I am able to see hierarchy.

 

Example of Tree..

I get data in a hierarchy. I assign Parent Ids to each record. I am ok with this. 

 

What I am struggling with is when I tried to add the GanttViews and it blows. up

 

Here is my initial load... I have not technically loaded any data. So I see the dates and columns all look good. 

 

During the loading of the data I get this error..

 

Clearly I am missing something.  I just don't know what.  

 

The only thing I have added between it loading the Tree and trying to load the timeline is ...


<GanttViews>

    <GanttWeekView></GanttWeekView>
    <GanttMonthView ></GanttMonthView>

</GanttViews>

        

 

Here is how I defined the start of the Gannt Control.

 


    <TelerikGantt Data="ServiceOrderData" 
                   Width="100%" 
                  Height="80vh"
                  ParentIdField="@nameof(ServiceOrder.ParentID)"
                  @ref="ServiceOrderRef"        
                  HasChildrenField=""
                  EnableLoaderContainer="true"
                  IdField="@nameof(ServiceOrder.ServiceOrderPk)"
                  StartField="@nameof(ServiceOrder.ServiceDate)"
                  EndField="@nameof(ServiceOrder.ServiceDate)"
                  TitleField="@nameof(ServiceOrder.WorkType)"
                  OnEdit="@OnEdit"                
                 
                  >

 

 

I clearly did not populate something that the Timeline needs. I am not sure what. It looks like all I need is the Start, End and TItle.  But I have tried different variations of that and it still fails. 

 

I am confused. Any suggestions? 

 

 

 

Abby
Top achievements
Rank 1
Iron
 asked on 21 Jan 2025
1 answer
105 views

Probably a bit of a vague question, but is there any way to make the “TabStrip” component tab texts appear vertically or is it planned to support this behavior sometime? I've tried modifying it a bit via css but I'm having problems with containers. I think I'm probably not using the right component for what I want to achieve... but if it helps anyone who is looking for the same idea it is already reflected here.

Hristian Stefanov
Telerik team
 answered on 21 Jan 2025
1 answer
140 views

The default visuals for the DialogFactory are distractingly different (aka ugly) from my application visuals.  Is there any way to modify the predefined dialogs?  I think they're a great idea and they do save me time on creating a custom component, but they seem visually inflexible?

Rob.

 
Hristian Stefanov
Telerik team
 answered on 21 Jan 2025
1 answer
94 views

Do we have the ability to differentiate which button is clicked on the Edit Recurring Appointment window?

I'm using a custom edit form, but I don't know if there is a way to tell which button is selected on this window. The default form can differentiate the button chosen but I do not find anything in the args that tells me the selection.

Any help would be appreciated.

 

Hristian Stefanov
Telerik team
 answered on 21 Jan 2025
0 answers
142 views

In the attached solution I have two Multi Column Headers - Product (containing ID and Product Name) and Details (containing In Stock, Unit Price, Discontinued and Release Date).  

I want the Excel download to reflect this, and to have a black border around all cells.

By default the multi column headers just take a single cell, it looks like this:

If I use worksheetExporter.MergeCells to merge the Product and Details cells, it looks better, but the border is gone from the right hand side of Details.

Can you advise how I can see the cells merged correctly but retain the border?

Thanks in advance,

Dean

 

Missing User
 asked on 20 Jan 2025
Narrow your results
Selected tags
Tags
+? more
Top users last month
Simon
Top achievements
Rank 2
Iron
Iron
Bob
Top achievements
Rank 3
Iron
Iron
Veteran
Marco
Top achievements
Rank 4
Iron
Iron
Iron
Grant
Top achievements
Rank 3
Iron
Iron
Iron
Kao Hung
Top achievements
Rank 1
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Simon
Top achievements
Rank 2
Iron
Iron
Bob
Top achievements
Rank 3
Iron
Iron
Veteran
Marco
Top achievements
Rank 4
Iron
Iron
Iron
Grant
Top achievements
Rank 3
Iron
Iron
Iron
Kao Hung
Top achievements
Rank 1
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?