Telerik Forums
UI for ASP.NET Core Forum
2 answers
29 views
I'm trying to add a standard html Select element as a custom toolbar item in the Editor. I was able to make this work up through Kendo for Asp.Net Core version 2024.Q4. Now in version 2025.Q1 the Select does not respond to clicking. A click doesn't drop down the Select so the user can choose an Option item. I added an onclick event handler, and the click event is registering, but it does not open the Select. The documentation doesn't give any reason why this should not work. The Select element and its Options look fine in the page. Any suggestions?
        //Add a dropdown tool for inserting symbols.
        string selectTitle = "Select a symbol to insert";
        //Standard html select.
        //Cannot find a way to use an html Select in Kendo 2025Q1. This worked in Kendo 2024.Q4,
        // after removing the 'ref-toolbar-tool' attribute from the div preceding the Select.
        string toolNameSelect = $"insertSymbol-{EditorIdClean}";
        string dropdownNameSelect = $"symbolSelect_{EditorIdClean}";
        string symbolSelect = $"<label for='{dropdownNameSelect}' class='visually-hidden'>Symbol:</label>" +
            $"<select id='{dropdownNameSelect}' " +
            $"title='{selectTitle}' " +
            $"aria-label='{selectTitle}' " +
            "style='width:150px' " +
            "onclick='testSymbolSelect(this)' " + //The click event is registered * the alert appears.
            "onchange='InsertSymbolSelect(this)' " +
            ">" +
            $"{symbolHtmlSelectOptions()}" +
            $"</select>";
        toolFactories.Add(tools => tools
            .CustomTemplate(x => x
                .Name(toolNameSelect)
                .Tooltip(selectTitle)
                .Template(symbolSelect)
            ));

Mihaela
Telerik team
 answered on 03 Apr 2025
1 answer
34 views

I'm currently redesigning the filter menus in our MVC ASP.NET Core project. As of now, they all have the default menu:

I would like to customise the menus according to the columns' data types - have date range pickers for dates, a slider from min to max value for numbers, etc. The main point is to make the process simpler - so the users only need to input a few characters/choose a date/slide to the right number, instead of filling out this complicated configuration.

Some of such components are provided by kendo (e.g. DateRangePicker), others aren't (e.g. the above-mentioned slider; at least I didn't find anything like it), but could be implemented with a custom function. Either way, I can't seem to be able to override the default filter menu.

The only promising suggesstion on how to achieve something like this that I found was:

grid.Columns(c => c.Bound(item.Name)
       .Filterable(ftb => ftb.UI("datePickerFilter"))
function datePickerFilter(element) {
    element.kendoDateRangePicker({
        messages: {
            startLabel: "Check-In",
            endLabel: "Check-Out"
        },
        format: "MM/dd/yyyy"
    });
}
Unfortunately, it did not work. So any help, advice or personal experience with a similar issue will be very much appreciated :) Thanks.
Anton Mironov
Telerik team
 answered on 03 Apr 2025
0 answers
25 views

Hi, I copied the gantt chart demo from the link below. I do not receive any errors but nothing shows in the timeline. Any idea what I am doing wrong? thank you 

 

ui-for-aspnet-core-examples/Telerik.Examples.RazorPages/Telerik.Examples.RazorPages/Pages/Gantt/GanttIndex.cshtml at master · telerik/ui-for-aspnet-core-examples · GitHub

superBren
Top achievements
Rank 1
 asked on 02 Apr 2025
0 answers
38 views

How do use the Loader as a Loading Container so it covers the whole UI with a transparent overlay 

 

@(Html.Kendo().Loader()
    .Name("loader")
    .Size(LoaderSize.Large)
    .Type(LoaderType.ConvergingSpinner)
    )
 
Andrew
Top achievements
Rank 1
Veteran
Iron
 updated question on 28 Mar 2025
1 answer
67 views
We are currently using telerik.ui.for.aspnet.core.2020.1.406 where the application is using .Net 6.0, we are planning to upgrade to latest supported version of Telerik UI for ASP.NET Core for that application. Will latest Telerik UI for ASP.NET Core 2025.1.227 work with no isseus under .Net 6.0 Application
Eyup
Telerik team
 answered on 27 Mar 2025
1 answer
28 views

Hi,

Does the Tile Layout support changing the columns as the screen reduces in size. For example, drop from 4 to 3 then 2 and finally 1 column?

Thanks,

Euan

Eyup
Telerik team
 answered on 24 Mar 2025
1 answer
36 views

In a popup template I am attempting to format decimal field to 

  • insert commas in the appropriate places
  • show 2 decimal places
  • show a $ sign when not editing the field.

I have the field decorated as follows


[DisplayName("Amount in $")]
[DisplayFormat(ApplyFormatInEditMode = false, DataFormatString = "{0:C2}")] 
public decimal? CollateralAmount { get; set; }


I have tried 2 different approaches.

The below code does not give me any of the 3 things I need


<forminput asp-for="CollateralAmount" asp-format="{0:C2}"></forminput>

The below code gives me a text box with spinners that provides the decimal places I need and the commas in the correct place but I do not want spinners and it does not put a $ sign in when I am not editing the field.


<input type="number" class="currency" name="CollateralAmount" data-type="currency" data-bind="value:CollateralAmount" data-role="numerictextbox" />

Anton Mironov
Telerik team
 answered on 24 Mar 2025
1 answer
24 views

Hi, I tried a lot of things and code i found here in the forum and in the documentations, but everything i found is for Jquery and it isnt working for .net core.

I have some checbkox to filter and show/hide the resources of my scheduler. The filtering is working, but i cant hide/show the selected/unselected resources.

Until the line 'scheduler.dataSource.filter(filter);' all is working fine, filtering the events. But i dont want to have the columns of the resources that arent selected... I found in a lot of topics that for that, i need the line 'scheduler.view(scheduler.view().name)' but is not working.

I found that for filter the datasource some people use 'scheduler.resources[0].dataSource.filter(filter);' but is not working for me, im using 'scheduler.dataSource.filter(filter)'.

How could i get that functionality? I need it... because i have a lot of 'medicos' resources and is impossible to visualize the scheduler with all.. i only need the selected ones.

Thanks in advance!

 

$("#medicosCheck :checkbox").change(function (e) {
    var checked = $.map($("#medicosCheck :checked"), function (checkbox) {
        return parseInt($(checkbox).val());
    });

    var filter = {
        logic: "or",
        filters: $.map(checked, function (value) {
            return {
                operator: "eq",
                field: "IdMedico",
                value: value
            };
        })
    };

    var scheduler = $("#citas").data("kendoScheduler");
    scheduler.dataSource.filter(filter);
    //scheduler.view(scheduler.view().name);
});

 

Ivaylo
Telerik team
 answered on 24 Mar 2025
1 answer
24 views

Hi,

Documentation page link not working:

https://www.telerik.com/aspnet-core-ui/documentation/html-helpers/layout/tilelayout?_gl=1*y89bt3*_gcl_aw*R0NMLjE3NDEwMDc5MzguQ2p3S0NBaUF3NVctQmhBaEVpd0FwdjRnb0JnbnlueS1qWmJjWENnNXVoMGdMcDJ6ZnZFcXQyWTNKem1YR2Y2aWNzakI3MWVnUzRVcnRSb0MyYUVRQXZEX0J3RQ..*_gcl_dc*R0NMLjE3NDEwMDc5MzguQ2p3S0NBaUF3NVctQmhBaEVpd0FwdjRnb0JnbnlueS1qWmJjWENnNXVoMGdMcDJ6ZnZFcXQyWTNKem1YR2Y2aWNzakI3MWVnUzRVcnRSb0MyYUVRQXZEX0J3RQ..*_gcl_au*OTUwNzEzNzE2LjE3NDE2MDE4MzU.*_ga*Mjk0NDM0NzQ4LjE2ODk2Njg4MTI.*_ga_9JSNBCSF54*MTc0MjM3NDQ2MC4xNTQuMS4xNzQyMzc0NTQ5LjMyLjAuMA..

Anton Mironov
Telerik team
 answered on 21 Mar 2025
1 answer
36 views

I am getting loading error when using aspnet Core grid with dynamic columns and Filterable option. The grid is loading fine when the Filterable option is not configured. Also, events are not working properly. I am using 2024.4.1112 version.

Here is sample code

 @(
     Html.Kendo().Grid<dynamic>()
     .Name(Model.GridId)
     .Columns(columns =>
     {
         foreach (var col in Model.Columns)
         {
             var kendoColumn = columns.Bound(col.PropertyName);
             kendoColumn.Title(col.Title);
             kendoColumn.Width(col.Width);
             kendoColumn.Filterable(col.Filterable);
             if (!string.IsNullOrEmpty(col.Format))
             {
                 kendoColumn.Format(col.Format);
             }
             if (!string.IsNullOrEmpty(col.Template))
             {
                 kendoColumn.ClientTemplate(col.Template);
             }
             if (col.DataType == "boolean")
             {
                 kendoColumn.HtmlAttributes(new { style = "text-align:center" });
             }
         }
     })
     .Pageable(p =>
     {
         p.ButtonCount(10);
         p.PageSizes(true);
         p.Refresh(true);
     })
     .Filterable(f => f.Mode(GridFilterMode.Menu))
     .Sortable()
     .ColumnMenu(c =>c.Filterable(true))
     .Reorderable(r => r.Columns(true))
     .Resizable(r => r.Columns(true))
     .DataSource(dataSource => dataSource
     .Ajax()
     .Read(read => read.Action("Entity", "History", new { entityName = Model.EntityName, pkValue = Model.PrimaryKeyValue, entityType = Model.EntityType, pkName = Model.PrimaryKeyName }))
     )
     .Events(e => e.Change("ob-select"))
     )
Mihaela
Telerik team
 answered on 19 Mar 2025
Narrow your results
Selected tags
Tags
+? more
Top users last month
Will
Top achievements
Rank 2
Iron
Motti
Top achievements
Rank 1
Iron
Hester
Top achievements
Rank 1
Iron
Bob
Top achievements
Rank 3
Iron
Iron
Veteran
Thomas
Top achievements
Rank 2
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Will
Top achievements
Rank 2
Iron
Motti
Top achievements
Rank 1
Iron
Hester
Top achievements
Rank 1
Iron
Bob
Top achievements
Rank 3
Iron
Iron
Veteran
Thomas
Top achievements
Rank 2
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?