Questions on UI for Blazor Forum

1 answer

34 views

Set the value attribute for a Submit ButtonType

Is there a way to set the value attribute for a submit button when using the TelerikButton.

For example, this is the button markup I am currently using:

<button type="submit" class="login100-form-btn" name="provider" value="@provider.Name"
									title="Log in using your @provider.DisplayName account">
								<TelerikSvgIcon Icon="@GetExternalIcon(provider.Name)" Size="@ThemeConstants.SvgIcon.Size.ExtraExtraLarge" Class="me-3" />
								Login using @provider.DisplayName
							</button>

I want to convert this to using a TelerikButton but I cannnot figure out how to set the value attribute when doing that.

Button

answered on 13 Nov 2024

1 answer

53 views

Is it possible to customize the telerikchart column y-axis values in blazor

I have a column chart with the x-axis representing whole month dates and each data point ranging in value from 0 to 86000. The y-axis now has a default range of 0 to 86000, with intervals of 10,000 each. I need to set the y-axis values to 0, 8000, 9000, 10000, 11000, 12000, 13000, 14000, 15000, 17000, 22000, 26000, 30000, 34000, 43000, 60000, and 86000. There are a total of 16 iterations. Is it possible using TelerikChart in Blazor to adjust the y-axis values as shown above?

Charts

answered on 13 Nov 2024

1 answer

90 views

Placing a second Grid Command Button to the right of the Grid Toolbar Template?

I would like to place a second button on the Grid Toolbar. That button should reside to the right side of the Toolbar so that the GridCommandButton for Add is on the far left and my second button should be on the far right.

What is the best/proper way to do this on the Blazor Grid?

Grid

answered on 13 Nov 2024

1 answer

64 views

Grid Selected Row highlight

UPD: Found a solution already, there was a bug in my code, everything is working ok, can i somehow delete this question post?

Grid

answered on 13 Nov 2024

1 answer

94 views

fieldset disabled for Telerik drop downs

I have a requirement to conditionally disable all controls in a TelerikForm. There a multiple ways to do that but what seems like the easiest to me is to wrap the form as such:

<TelerikForm>...

</fieldset>

I have buttons, text boxes, date pickers and drop down lists in my form. All of the controls get disabled except for the drop downs. Is there a simple way to do this so the drop downs will get included? I know I could do this through javascript or whatever but it just struck me as weird that most of the Telerik controls are disabled except for the drop downs.

Thanks.

DropDownList

answered on 12 Nov 2024

1 answer

38 views

Tile component is navigable even though it shouldn't be?

I am using the teleriktilelayout component. I have resizing and reordering turned off, but we may have it as a feature in the future. Since they are turned off, I need the tiles to be taken out of the tab order and not be navigable. I know that navigable=false is the default, but all the tiles have tabindex=0 (making them tabbable/navigable). Adding navigable=false to the main component doesn't work (and again, it's supposed to be the default).

How do I change it to tabindex=-1 on the tiles? Is there any other way to remove the tiles from the tab order? Is this a known accessibility issue?

Accessibility

TileLayout

answered on 12 Nov 2024

7 answers

1.7K+ views

Accessing Filtered Data in Grid

Is there currently a way to access filtered data from the grid? I want users to be able to filter data in the grid and then display it in a chart. The only way I can see to do it is by rolling my own filtering code with the OnRead event.

Grid

answered on 11 Nov 2024

0 answers

45 views

Issue with Display of Divided Slots in Telerik Blazor Scheduler

Hi,

Dear Telerik Support Team,

I am reaching out to report an issue with the display of time slots in the Telerik Blazor Scheduler. I have configured the Scheduler to show time slots divided into intervals (e.g., 15-minute divisions) between each hour. However, the display does not reflect this configuration as expected.

Current Behavior: In the current Scheduler view (refer to attached "ActualCalendar.png"), each hour is displayed as a single block without any subdivisions. This makes it challenging to view and schedule appointments with finer time granularity.

Expected Behavior: I would like the Scheduler to display time slots in a divided format, as shown in the "ExpectedCalendar.png" attachment. In this view, each hour is divided into 15-minute intervals (or the chosen interval), allowing for more precise scheduling and time management.

Request: Could you please guide me on how to achieve the expected behavior with the Telerik Blazor Scheduler? I have already tried adjusting the SlotDuration and MinorTickCount properties, but it does not seem to produce the desired effect.

Your assistance in resolving this issue would be greatly appreciated, as the ability to view divided time slots is crucial for our application's scheduling requirements.

Thank you for your time and support.

Best regards,
Pavan Rahul

Scheduler

asked on 11 Nov 2024

1 answer

57 views

Chart fails to bind data when properties have JsonPropertyName attribute

We have a type that we are trying to bind to a column chart. The chart fails to bind if the properties are decorated with JsonPropertyName attribute. Remove the attribute the data binds Ok. Is there a work around that allows us to keep the attribute decoration?

namespace Poseidon.BackOffice.Blazor.Features.Transactions.Components
{
public record TransactionSummaryResponse2
{
[JsonPropertyName("transactionDate")]
public DateOnly TransactionDate { get; init; }

[JsonPropertyName("expiredCount")]
public long ExpiredCount { get; init; }

[JsonPropertyName("expiredTotalAmountInMinorUnits")]
public decimal ExpiredTotalAmountInMinorUnits { get; init; }

[JsonPropertyName("successfulCount")]
public long SuccessfulCount { get; init; }

[JsonPropertyName("successfulTotalAmountInMinorUnits")]
public decimal SuccessfulTotalAmountInMinorUnits { get; init; }

[JsonPropertyName("failedCount")]
public long FailedCount { get; init; }

[JsonPropertyName("failedTotalAmountInMinorUnits")]
public decimal FailedTotalAmountInMinorUnits { get; init; }

[JsonPropertyName("vendFailedCount")]
public long VendFailedCount { get; init; }

[JsonPropertyName("vendFailedTotalAmountInMinorUnits")]
public decimal VendFailedTotalAmountInMinorUnits { get; init; }
}

public partial class TransactionReportSummary
{
List<TransactionSummaryResponse2> transactionByDateResponse2 = new();

protected override void OnInitialized()
{
TransactionSummaryResponse2 transactionSummaryResponse2item = new TransactionSummaryResponse2 { TransactionDate = new DateOnly(2024, 11, 5), ExpiredCount = 1, FailedCount = 2, SuccessfulCount = 3, VendFailedCount = 4 };
transactionByDateResponse2.Add(transactionSummaryResponse2item);
transactionSummaryResponse2item = new TransactionSummaryResponse2 { TransactionDate = new DateOnly(2024, 11, 4), ExpiredCount = 1, FailedCount = 2, SuccessfulCount = 3, VendFailedCount = 4 };
transactionByDateResponse2.Add(transactionSummaryResponse2item);
transactionSummaryResponse2item = new TransactionSummaryResponse2 { TransactionDate = new DateOnly(2024, 11, 3), ExpiredCount = 1, FailedCount = 2, SuccessfulCount = 3, VendFailedCount = 4 };
transactionByDateResponse2.Add(transactionSummaryResponse2item);
}
}
}

Charts

answered on 08 Nov 2024

0 answers

61 views

Grid applying user-select-none

I have a telerik grid and the user-select-none and k-user-select_none css is getting applied to the grid preventing text selection but for the life of me I can't figure out why that's getting applied. I have grids in other applications where that doesn't get applied so why this one? What causes the grid to apply that css? The grid setup doesn't seem to be materially different between applications so any guidance would be appreciated.

Grid

asked on 07 Nov 2024