Telerik Forums
UI for ASP.NET Core Forum
1 answer
69 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
40 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
69 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
134 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
43 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
66 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
54 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
31 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
56 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
1 answer
100 views

I am encountering an issue while integrating a Kendo Grid within a TabStrip. Whenever I attempt to add the Grid, I receive the attached error(image.png) in the browser console:  Uncaught Error: Invalid template.

Below is the code I am trying to put inside TabStrip. Not sure Please let me know what the mistake I am doing. 

 <div id="divEquipmentDetailsGrid" >
     @(Html.Kendo().Grid<EPP.Core.DTOs.UserEqupmentDetailsDTO>(Model.UserEquipDetails)
                     .Name("EquipmentDetailsGrid")
                     .Columns(columns =>
                     {
                         columns.Bound(p => p.EquipmentName).Title("ss");
                         columns.Bound(p => p.AssertTag).Width(130).Title("tt");
                         columns.Bound(p => p.Accessories).Width(130).Title("rr");
                     })
                 )
 </div>

If I remove the above code I am able to see tabs and data inside the tabs but When I add above code, nothing is displaying and getting error.

 

I am attaching full code cshtml file.

Justin
Telerik team
 answered on 13 Mar 2025
Narrow your results
Selected tags
Tags
+? more
Top users last month
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
Sergii
Top achievements
Rank 1
Iron
Iron
Iron
Dedalus
Top achievements
Rank 1
Iron
Iron
Lan
Top achievements
Rank 1
Iron
Doug
Top achievements
Rank 1
Want to show your ninja superpower to fellow developers?
Top users last month
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
Sergii
Top achievements
Rank 1
Iron
Iron
Iron
Dedalus
Top achievements
Rank 1
Iron
Iron
Lan
Top achievements
Rank 1
Iron
Doug
Top achievements
Rank 1
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?