Questions on UI for ASP.NET Core Forum

1 answer

232 views

Hi,

Is it possible to set the height of the combobox dropdown in JavaScript.

I can set it in the taghelper but I have the combobox beside another element on the page and I want to match the heights.

It seems to be that I should be able to set it in the open event for the combobox but I can't seem to get it to work.

Is there a property on the Combobox that I should change?

Changing the height on the data-role div seems to get overwritten.

Any suggestions?

Thanks,

Charlotte

ComboBox

answered on 21 Jun 2022

1 answer

620 views

Install Telerik Core without Nuget at all

Hello,

I am stuck behind a corporate network that does not allow me to connect to the telerik nuget feed. How can I install without NuGet? I looked at the MSI installer instructions but it seemed like that installed a nuget package file to use nuget for the install as well. We just need to be able to download the necessary files and add them as references in our project. Not sure which files need to be included etc.

Thanks in advance!

General Discussions

answered on 21 Jun 2022

1 answer

274 views

erro, asp net core- .net core 3.1

Boa tarde.

Eu instalei a versão mais recente do KendoUICore para .netcore 3.1, e continua a dar este erro:

System.AggregateException
HResult=0x80131500
Message=Some services are not able to be constructed (Error while validating the service descriptor 'ServiceType: Kendo.Mvc.Rendering.IKendoHtmlGenerator Lifetime: Transient ImplementationType: Kendo.Mvc.Rendering.KendoHtmlGenerator': Could not load type 'Microsoft.AspNetCore.Mvc.Internal.ClientValidatorCache' from assembly 'Microsoft.AspNetCore.Mvc.Core, Version=3.1.25.0, Culture=neutral, PublicKeyToken=adb9793829ddae60'.)
Source=Microsoft.Extensions.DependencyInjection
StackTrace:
at Microsoft.Extensions.DependencyInjection.ServiceProvider..ctor(IEnumerable`1 serviceDescriptors, ServiceProviderOptions options)
at Microsoft.Extensions.DependencyInjection.ServiceCollectionContainerBuilderExtensions.BuildServiceProvider(IServiceCollection services, ServiceProviderOptions options)
at Microsoft.Extensions.DependencyInjection.DefaultServiceProviderFactory.CreateServiceProvider(IServiceCollection containerBuilder)
at Microsoft.Extensions.Hosting.Internal.ServiceFactoryAdapter`1.CreateServiceProvider(Object containerBuilder)
at Microsoft.Extensions.Hosting.HostBuilder.CreateServiceProvider()
at Microsoft.Extensions.Hosting.HostBuilder.Build()
at WebApplication2.Program.Main(String[] args) in C:\Users\Pedro.q.Magalhaes\source\repos\WebApplication2\WebApplication2\Program.cs:line 17

This exception was originally thrown at this call stack:
[External Code]

Inner Exception 1:
InvalidOperationException: Error while validating the service descriptor 'ServiceType: Kendo.Mvc.Rendering.IKendoHtmlGenerator Lifetime: Transient ImplementationType: Kendo.Mvc.Rendering.KendoHtmlGenerator': Could not load type 'Microsoft.AspNetCore.Mvc.Internal.ClientValidatorCache' from assembly 'Microsoft.AspNetCore.Mvc.Core, Version=3.1.25.0, Culture=neutral, PublicKeyToken=adb9793829ddae60'.

Inner Exception 2:
TypeLoadException: Could not load type 'Microsoft.AspNetCore.Mvc.Internal.ClientValidatorCache' from assembly 'Microsoft.AspNetCore.Mvc.Core, Version=3.1.25.0, Culture=neutral, PublicKeyToken=adb9793829ddae60'.

Grid

answered on 14 Jun 2022

1 answer

615 views

How to disable a grid button after successful post

I have an ajax post method where the user will sign up for an open slot. After the slot gets assigned, I want to disable the button and change the text. Can anyone tell me what I'm doing wrong here. I'm coming from Web Forms to MVC so it's been a little learning curve.

here's my grid

@(Html.Kendo().Grid(Model)
                .Name("Grid")
                .Columns(columns =>
                {
                    columns.Bound(p => p.Id).Hidden(true);
                    columns.Bound(p => p.JobStartDateTime).Visible(false);
                    columns.Bound(p => p.JobInfo).Title("Job");
                    columns.Bound(p => p.JobTimes).Title("Times");
                    columns.Bound(p => p.JobPayDisplay).Title("Pay");
                    columns.Command(cmd => cmd.Custom("Details").Click("Details"));
                    columns.Command(cmd => cmd.Custom("Sign Up").Click("SignUp"));


                })
                .Pageable()
                .Scrollable(scr => scr.Height(500))
                        .DataSource(dataSource => dataSource
                            .Ajax()
                            .PageSize(20)
                            .ServerOperation(false)
                        )
                )

and then here's the javascript function

function SignUp(e) {
        var id = $(e.currentTarget).closest("tr").find('td:first').html();
        $.ajax({
            type: 'POST',
            url: '/Jobs/SignUp',
            data: {id : id},
            headers: { "RequestVerificationToken": $('input[name="__RequestVerificationToken"]').val() },
            contentType: 'application/x-www-form-urlencoded; charset=UTF-8', 
            success: function (result) {
                alert(result);
                $(this).find(".k-grid-SignUp").addClass("k-state-disabled");
                $(this).find(".k-grid-SignUp").text("Awarded");
            },
            error: function () {
                alert('Failed  ' + result);
                
            }
        })
    }

Grid

answered on 13 Jun 2022

1 answer

949 views

How to filter a grid column from a ComboBox selected value

I have a combobox separate from my grid and I want to use the comboBox selected value to filter the grid results. Do I need to do this in Java script? What is the best way to do this?

   @(Html.Kendo().ComboBox()
                .Name("comboBox")
                .Size(ComponentSize.Small)
                .DataTextField("Text")
                .DataValueField("Value")
                .Filter(DateTime.Today.Year.ToString())
                .HtmlAttributes(new { style = "width:100%;" })
                .BindTo(new List<SelectListItem>()
                {
                    new SelectListItem() {
                        Text = "2018", Value = "2018"
                    },
                    new SelectListItem() {
                        Text = "2019", Value = "2019"
                    },
                    new SelectListItem() {
                        Text = "2020", Value = "2020"
                    },
                      new SelectListItem() {
                        Text = "2021", Value = "2021"
                    },
                      new SelectListItem() {
                        Text = "2022", Value = "2022"
                    },
                      new SelectListItem() {
                        Text = "2023", Value = "2023"
                    },
                      new SelectListItem() {
                        Text = "2024", Value = "2024"
                    }
                })
         )

@(Html.Kendo().Grid<Golf.DataAccess.Models.GoodGolfSchool>()
    .Name("grid")
    .Filterable()
    .Columns(columns => {
        columns.Bound(pkey => pkey.Id).Hidden(true);
        columns.Bound(c => c.FirstName).Filterable(false);
        columns.Bound(c => c.LastName);
        columns.Bound(c => c.Email);
        columns.Bound(c => c.VillageId).Width(100);
        columns.Bound(c => c.ClassDateView).ClientTemplate("#=ClassDateView#")
               .Filterable(f => f.Multi(true).CheckAll(false));
        columns.Bound(c => c.Phone);
        columns.Bound(c => c.EntryDate).Hidden();
        columns.Command(cmd =>
        {
            cmd.Edit();
            cmd.Destroy();
        });
    })
    .DataSource(dataSource => dataSource
        .Ajax()
        .PageSize(20)
        .ServerOperation(true)
        .Read(read => read.Action("GolfSchoolRoster_Read", "GoodGolfSchools"))
        .Update(update => update.Action("Student_Edit", "GoodGolfSchools"))
        .Destroy(delete => delete.Action("Student_Distroy", "GoodGolfSchools"))
        .Model(model =>
        {
            model.Id(p => p.Id);
            model.Field(p => p.Id).Editable(false);
            model.Field(p => p.EntryDate).Editable(false);
            model.Field(p => p.ClassDateView).DefaultValue(
                ViewData["ScheduleDates"] as Golf.DataAccess.Models.ClassDateViewModel);
        })
        .Filter(filters => {
            filters.Add(model => model.ClassDate.Year).IsEqualTo([SELECTED VALUE FROM COMBOBOX ABOVE] );
        })
    )
    .ToolBar(tools =>
    {
        tools.Excel().Text("Export To Excel");
    })
    .Excel(excel =>
    {
        excel.FileName("GoodGolfSchool.xlsx");
        excel.AllPages(true);
       
    })
    .Pageable()
    .Sortable()
    .AutoBind(true)
    .Editable(edit => edit.Mode(GridEditMode.InLine))
)

ComboBox

Grid

updated answer on 06 Jun 2022

1 answer

552 views

Grid TagHelper ClientHeaderTemplate

Hi Guys,

maybe i'm missing something, but could someone help me how i could define a ClientHeaderTemplate / HeaderTemplate for a Grid Column with the TagHelper?

<columns>
   <column field="Alert" title="" ***/>
</columns>

Thanks for your help!

Best wishes
Patrick

Grid

answered on 03 Jun 2022

1 answer

312 views

Set linear gradient color for each category in single series chart

I have the same data structure as the original poster here (https://www.telerik.com/forums/set-color-for-each-category-in-single-series-chart#1405418), except I need to use a linear gradient as color for each category. How do I define a linear gradient as color for each category in asp.net core? I have a ColorFrom and ColorTo (hex, string) in my data model, and this is the sample chart I am trying to create:

Chart

ColorGradient

answered on 02 Jun 2022

1 answer

143 views

ASP.NET Core TreeView href not working

I am unable to get the href to work in the asp .net core treeview control (Razor). Am I doing something wrong?

<kendo-treeview name="treeView">
<items>
<treeview-item text=Test expanded="true">
<items>
<treeview-item text="Google" href="http://www.google.com" />
</items>
</treeview-item>
</items>
</kendo-treeview>

TreeView

answered on 01 Jun 2022

1 answer

727 views

Upgrade to Nuget package Telerik.UI.for.AspNet.Core 2022.2.510 now requires nuget package Microsoft.AspNetCore.Mvc.NewtonsoftJson

In Core 6 project setting following global JSON option to maintain property case (such as required for returning JSON result for Kendo Grids), since the Telerik upgrade, you now have to manually add Microsoft.AspNetCore.Mvc.NewtonsoftJson nuget package

builder.Services.AddRazorPages().AddNewtonsoftJson(options => options.SerializerSettings.ContractResolver = new DefaultContractResolver());

or change to use System.Text.Json

builder.Services.AddRazorPages().AddJsonOptions(options => options.JsonSerializerOptions.PropertyNamingPolicy = null);

General Discussions

Grid

answered on 01 Jun 2022

1 answer

307 views

TabStrip reload undefined

Hello,

I am trying to reload the content of one of my Tabs in different scenarios. I have different grids and other tabs that when their content changes I need to reload my checklist tab. However, when I call tabStrip.reload("li:first"); I get reload undefined.

Here is my TabStrip:

                  @(
                        Html.Kendo().TabStrip()
                        .Name("CaseTabStrip")
                        .TabPosition(TabStripTabPosition.Left)
                        .Animation(animation => animation.Open(effect => effect.Fade(FadeDirection.In).Duration(5)))
                        .Events(events => events.ContentLoad("onContentLoad"))
                        .Items(items =>
                        {
                            items.Add().Text("Checklist")
                                .Selected(true)
                                .LoadContentFrom(Url.Action("Checklist", "Cases", new { caseId = Model.Id }));
                           
// Extra tabs removed for brevity

                            items.Add().Text("Documents")
                                .LoadContentFrom(Url.Action("Index", "Documents", new { caseId = Model.Id }));
                        })
                        .HtmlAttributes(new { @class = "mt-5" })
                    )

And, this is how I am implementing the reload of the Checklist tab.

        var ReloadChecklist = () => {
            var tabStrip = $("#CaseTabStrip").data("kendoTabStrip");
            tabStrip.reload("li:first"); // No console error, but stepping through code shows "reload undefined"
        }

        function DocTypeRequestEnd(e) {
            var grid = $("#Documents").data("kendoGrid");
            if (grid) {
                grid.dataSource.read();
            }
            ReloadChecklist();
            GridRequestEnd(e);
        }

Where I call tabStrip.reload() I don't get a console error but the debugger show "reload undefined." It's odd because I can inspect the tabStrip variable and see my items. I can also see reload as an option under <prototype>

TabStrip

answered on 01 Jun 2022