I have buttons in this app that are wider than the default width.  But the entire area of the button does not accept a click.  The button is:

                    <div class="col-xl-2 col-md-3 col-sm-12">
                        <TelerikTooltip TargetSelector="a[title]">
                        </TelerikTooltip>
                        <a title="Unsubmitting a timesheet will return it to your list of current timesheets.">
                            <TelerikButton IconClass="far fa-undo-alt" OnClick="@(e => { IsShowPendingConfirmationWindow = true; })" Class="action-button-center">Unsubmit</TelerikButton>
                        </a>

                    </div>

The class is: 

.action-button-center {
    width: 150px;
    height: 35px;
    margin: 0 auto;
    display: block;
    text-align: center !important;
 /*   border-radius: 4px;*/
}

But only the area indicated in the attached .png is clickable.  Is there a way to set the clickable area to the entire button?

Hello,

I have some questions regarding the different TelerikCharts.

1. Is there a way to enable drag on a series, to change the value?
I have attached some example code, on how I could like it to work.

2. Is there a way to disable series click when right clicking?
I still would like to use series click, but only on leftclick.

3. Is there a way to open a context menu on a series, when right clicking?

Regards,
Nikolas

Hi,

I have a combobox control used to complete a country item in a form, but I'm not able to set the control with the existing country field.

My code:

razor:

@inherits Component
<TelerikComboBox TItem="CountryModel"
				 TValue="int"
				 Data="SearchResult"
				 OnRead="SearchDataAsync"
				 Filterable="true"
				 TextField="Name"
				 ValueField="Id"
				 @bind-Value="SelectedId"
				 Width="@Width">
</TelerikComboBox>

razor.cs

using Core.Common.Models;
using Microsoft.AspNetCore.Components;
using Telerik.Blazor.Components;
using Telerik.DataSource;
using WebApp.Client.Services;

namespace WebApp.Client.Components.Views.Common
{
	public partial class CountryAutocomplete
	{
		[Parameter]
		public Action<CountryModel> ValueChanged { get; set; }

		[Parameter]
		public CountryModel Value { get; set; }

		[Parameter]
		public string Width { get; set; } = "100%";

		[Inject]
		public StaticDataService StaticDataService { get; set; }

		private List<CountryModel> SearchResult { get; set; } = new();

		private int _selectedId { get; set; }
		private int SelectedId
		{
			get
			{
				return _selectedId;
			}
			set
			{
				_selectedId = value;
				var selected = SearchResult.Single(x => x.Id == value);
				ValueChanged?.Invoke(selected);
			}
		}

		protected override async Task OnParametersSetAsync()
		{
			Console.WriteLine(SelectedId);
			if (Value != null && Value.Id > 0 && SelectedId == 0)
			{
				SearchResult = new List<CountryModel>
				{
					Value
				};
				SelectedId = Value.Id;
			}
			await base.OnParametersSetAsync();
		}

		private async Task SearchDataAsync(ComboBoxReadEventArgs args)
		{
			if (args.Request.Filters.Count > 0)
			{
				var filter = args.Request.Filters[0] as FilterDescriptor;
				var search = filter.Value.ToString();
				if (search.Length >= 2)
				{
					SearchResult = await StaticDataService.GetCountriesAsync(search);
					args.Data = SearchResult;
				}
			}
		}
	}
}

public class CountryModel : Model
	{
		public int Id { get; set; }

		public string Code { get; set; }

		public string Name { get; set; }

		public EnumCitizenship Citizenship { get; set; }

		public override string ToString()
		{
			return Name;
		}
	}

Value is the country item passed as parameter from a parent component. The control works properly, including ValueChanged callback, except the pre-selecting. 

Hello,

Is there any way to set custom template to calendar's cell.

I'm not writing about css class, but also structure - I want to add additional data to cell (like number work hours in each day).

Thanks.

I'm trying to export my chart to PDF using the telerikClientExporter.js and I'm getting this error:

Is there a way to initialize a TelerkGrid with html Table containing multiple headers like this: HTML/CSS Share (codepen.io)

I need to be able to display currency formatted to the users locale.

My app is hosted on a machine in the U.S. but the users are in the UK.

I need to have £ for the UK and $ for the U.S.  A point in the right directly would be great!

Thanks ... Ed

Hello,

The Drag & Drop operation between treeviews is difficult when the tree is empty or mostly empty. The only valid drop targets are existing nodes. I would like to see the empty space in a treeview also available as a drop target. Can we log this as a request? In the meantime is it possible to drop a node on an empty treeview?

Thank You,

-Andy

This turned out to be a cache problem. Thought I cleared it, but apparently not. Today it works.

I'm trying to implement some very basic toast notifications in a simple form WASM app.

There are two code paths where notifications would be displayed, based on form data. One of them works perfectly every time. The other refuses to work at all, despite the code being called.

I've tried all of the usual Visual Studio things (clean, deleting bin/obj, restarting, etc.) and the behavior persists. There's nothing in the browser's console to indicate a failure.
This is my first attempt at using a Telerik control. It's also my first real Blazor app. Maybe there's something basic I didn't do correctly that's causing weird side effects. Nothing else really makes sense considering how simple this code is.

Here's the UI bits...

<TelerikNotification @ref="@NotificationReference" Class="MyTelerikNotification" VerticalPosition=NotificationVerticalPosition.Top HorizontalPosition=NotificationHorizontalPosition.Center></TelerikNotification>
<h3>@FlightTitle</h3>
<ul>
    @foreach (var question in ThisFlightForm.Form.TrueFalseQuestions)
    {
        <FormQuestionTrueFalse thisFormItem=question />
    }
</ul>
<div>
    <button @onclick="OnClick_BtnSubmit" class="btn">Submit</button>
    <button @onclick="OnClick_BtnCancel" class="btn">Cancel</button>
</div>

Inside the code block is the Notification Reference declaration:

public TelerikNotification NotificationReference { get; set; } = new();

Here's the method call that's having issues. The obvious thing to check is the value of canSubmit, which works perfectly fine.
If I put the ShowToasts calls from the IF down into the ELSE, they are fine.

private void OnClick_BtnSubmit()
    {
        var canSubmit = _preSubChecks.CanFormBeSubmitted(ThisFlightForm);
        if (canSubmit.ChecksPassed)
        {
            //this does not work at all, despite being called
            ShowToasts($"Unable to submit form - {canSubmit.ErrorMsg}", ThemeConstants.Notification.ThemeColor.Error);
            ShowToasts("Submitting Form", ThemeConstants.Notification.ThemeColor.Info);
            ShowToasts("Success!", ThemeConstants.Notification.ThemeColor.Success);
        }
        else
        {   //this works fine
            ShowToasts($"Unable to submit form - {canSubmit.ErrorMsg}", ThemeConstants.Notification.ThemeColor.Error);
        }

    }

Here's the method that shows the toast notifications. I added a temp var and a console out so I could verify the object wasn't null for some reason.

private void ShowToasts(string msg, string toastType)
    {
        var tmpNm = new NotificationModel()
            {
                Text = msg,
                ThemeColor = toastType,                
            };
        NotificationReference.Show(tmpNm);
        Console.WriteLine(JsonConvert.SerializeObject(tmpNm));
    }

Here's the output from the console logs where the Notification control refuses to display (the if):

{"ThemeColor":"error","Closable":true,"CloseAfter":5000,"ShowIcon":true,"Icon":null,"Text":"Unable to submit form - "}
{"ThemeColor":"info","Closable":true,"CloseAfter":5000,"ShowIcon":true,"Icon":null,"Text":"Submitting Form"}
{"ThemeColor":"success","Closable":true,"CloseAfter":5000,"ShowIcon":true,"Icon":null,"Text":"Success!"}

The first Notification (the error) is only here just to make sure the problem wasn't the content or the Notification display type being a problem.

Here's the output from the one that works (the else):

{"ThemeColor":"error","Closable":true,"CloseAfter":5000,"ShowIcon":true,"Icon":null,"Text":"Unable to submit form - At least one question was not answered"}

Aside from the Text, this is exactly the same as the error notification I put into the code that refuses to work.