Telerik Forums
UI for ASP.NET Core Forum
1 answer
160 views
I have Visual Studio 2022 installed and want to use datepicker. Where is the datepicker.dll locate so I can reference it?
Alexander
Telerik team
 answered on 30 May 2023
1 answer
566 views

I'm wondering if there is any support for styling a Dialog in the .net core version of telerik that I am trialling right now?  The documentation lists the ability to add a cssclass but that is only for the button, not for the entire dialog itself, I need to replicate previous functionality we were using where a cssclass is applied to the object in javascript when the dialog has been open for a certain amount of time.

This was the only documentation I could find and it's only able to add a class to the button, not the entire dialog.

Configuration, methods and events of Kendo UI Dialog - Kendo UI for jQuery (telerik.com)

Alexander
Telerik team
 answered on 29 May 2023
1 answer
442 views

I have a grid defined as such:

@(Html.Kendo().Grid<AuditViewModel>()
    .Name("AuditLogGrid")
    .Columns(columns =>
    {
        columns.Bound(c => c.Id).Hidden(true);
        columns.Bound(c => c.UserId).HtmlAttributes(new { @class = "k-text-right", style = "vertical-align: text-top" });
        columns.Bound(c => c.TableName).HtmlAttributes(new { @class = "k-text-right", style = "vertical-align: text-top" });
        columns.Bound(c => c.AuditType).HtmlAttributes(new { @class = "k-text-right", style = "vertical-align: text-top" });
        columns.Bound(c => c.KeyValuesValue).Encoded(false).HtmlAttributes(new { @class = "k-text-right", style = "vertical-align: text-top" });
        columns.Bound(c => c.OldValuesValue).Encoded(false).HtmlAttributes(new { @class = "k-text-right", style = "vertical-align: text-top" });
        columns.Bound(c => c.NewValuesValue).Encoded(false).HtmlAttributes(new { @class = "k-text-right", style = "vertical-align: text-top" });
        columns.Bound(c => c.ChangedColumnsValue).HtmlAttributes(new { @class = "k-text-right", style = "vertical-align: text-top" });
    })
    .Pageable(pager => pager.Refresh(true))
    .Sortable()
    .Filterable()
    .NoRecords()
    .DataSource(dataSource => dataSource
        .Ajax()
        .Batch(true)
        .PageSize(10)
        .ServerOperation(true)
        .Events(events => events.Error("error_handler"))
        .Model(model =>
        {
            model.Id(p => p.Id);
            model.Field(p => p.UserId);
            model.Field(p => p.TableName);
            model.Field(p => p.AuditType);
            model.Field(p => p.KeyValuesValue);
            model.Field(p => p.OldValuesValue);
            model.Field(p => p.NewValuesValue);
            model.Field(p => p.ChangedColumnsValue);
        })
        .Read(read => read.Action("GetAuditLogs", "Audit").Data("forgeryToken"))
    ))

And in my "GetAuditLogs" controller methods, I pass in the "request.Page" and "request.PageSize" to calculate Skip and Take.  The EF query call DOES return records (default is set to 10 records) however when returning from the Controller, the Grid displays "No Records"

My controller method is as follows:


[HttpPost]
    [ValidateAntiForgeryToken]
    public async Task<IActionResult> GetAuditLogsAsync([DataSourceRequest] DataSourceRequest request)
    {
        _logger.LogDebug("GetAuditLogsAsync()");
        try
        {
            var logs = await _auditService.GetAsync(null, q => q.OrderByDescending(x => x.DateTime),
                string.Empty, request.Page, request.PageSize);
            var total = await _auditService.CountAsync(null, string.Empty);
            var models = logs.Select(x => new AuditViewModel
            {
                Id = x.Id,
                UserId = x.UserId,
                DateTime = x.DateTime,
                TableName = x.TableName,
                AuditType = x.Type,
                KeyValues = string.IsNullOrWhiteSpace(x.PrimaryKey) ? new Dictionary<string, object>() :
                    JsonSerializer.Deserialize<Dictionary<string, object>>(x.PrimaryKey),
                OldValues = string.IsNullOrWhiteSpace(x.OldValues) ? new Dictionary<string, object>() :
                    JsonSerializer.Deserialize<Dictionary<string, object>>(x.OldValues),
                NewValues = string.IsNullOrWhiteSpace(x.NewValues) ? new Dictionary<string, object>() :
                    JsonSerializer.Deserialize<Dictionary<string, object>>(x.NewValues),
                ChangedColumns = string.IsNullOrWhiteSpace(x.AffectedColumns) ? new List<string>() :
                    JsonSerializer.Deserialize<List<string>>(x.AffectedColumns)
            });

            var result = await models.ToDataSourceResultAsync(request);
            result.Total = total;
            return Json(result);
        }
        catch (Exception ex)
        {
            _logger.LogError($"GetAuditLogsAsync() | error [{ex}]", ex);
            throw;
        }
    }

And the Audit Service "GetAsync" looks like:


public async Task<IEnumerable<Data.Entities.Audit>> GetAsync(
        Expression<Func<Data.Entities.Audit, bool>>? filter = null,
        Func<IQueryable<Data.Entities.Audit>, IOrderedQueryable<Data.Entities.Audit>>? orderBy = null,
        string includeProperties = "",
        int page = 0,
        int pageSize = 0)
    {
        IQueryable<Data.Entities.Audit> query = _dbSet;
        if (filter != null)
        {
            query = query.Where(filter);
        }

        if (!string.IsNullOrWhiteSpace(includeProperties))
        {
            query = includeProperties.Split(new[] { ',' }, StringSplitOptions.RemoveEmptyEntries)
                .Aggregate(query, (current, includeProperty) => current.Include(includeProperty));
        }

        var result = orderBy != null
            ? orderBy(query)
            : query;

        if (page > 0 && pageSize > 0)
        {
            result = result.Skip((page - 1) * pageSize).Take(pageSize);
        }

        return await result.ToListAsync();
    }

I have verified that the returned results ARE correct (based on Id's), but the Grid displays "No Records".  I'd rather not return the ENTIRE dataset to the grid as it is quite large (and the models can be large - this is for auditing so it contains EVERYTHING that was modified).  Is there something I'm missing?
Mike
Top achievements
Rank 1
Iron
Iron
 answered on 28 May 2023
1 answer
212 views

I have a grid defined as thus:

@(Html.Kendo().Grid<SubServiceViewModel>()
    .Name("SubServiceGrid")
    .Columns(columns =>
    {
        columns.Bound(c => c.Id).Hidden(true);
        columns.Bound(c => c.Service)
            .ClientTemplate("#=Service.Value#")
            .Filterable(false)
            .Sortable(false);
        columns.Bound(c => c.Value);
        columns.Bound(c => c.Active).Hidden(true);
        columns.Bound(c => c.Deleted).Hidden(true);
        columns.Command(c => c.Destroy());
    })
    .ToolBar(toolbar =>
    {
        toolbar.Create();
        toolbar.Save();
    })
    .Editable(editable => editable.Mode(GridEditMode.InCell))
    .Pageable(pager => pager.Refresh(true))
    .Sortable()
    .Filterable()
    .NoRecords()
    .DataSource(dataSource => dataSource
        .Ajax()
        .Batch(true)
        .PageSize(10)
        .ServerOperation(true)
        .Events(events => events.Error("error_handler").RequestEnd("onRequestEnd('staticNotifications')"))
        .Model(model =>
        {
            model.Id(p => p.Id);
            model.Field(p => p.Service).DefaultValue(ViewData["defaultService"] as ServiceViewModel);
            model.Field(p => p.Value);
            model.Field(p => p.Active).DefaultValue(EntityLiterals.Yes);
            model.Field(p => p.Deleted).DefaultValue(EntityLiterals.No);
        })
        .Read(read => read.Action("GetSubServices", "SubService").Data("forgeryToken"))
        .Create(create => create.Action("CreateSubServices", "SubService").Data("forgeryToken"))
        .Update(update => update.Action("UpdateSubServices", "SubService").Data("forgeryToken"))
        .Destroy(destroy => destroy.Action("DeleteSubServices", "SubService").Data("forgeryToken"))
    ))

And if I remove the 

.Filterable(true)

I get a JS error when I click the column filter button


Uncaught TypeError: Cannot convert undefined or null to object
    at Function.keys (<anonymous>)
    at C (kendo.all.js:318535:21)
    at init._createForm (kendo.all.js:318535:21)
    at init._init (kendo.all.js:318535:21)
    at init._click (kendo.all.js:318535:21)
    at HTMLAnchorElement.dispatch (jquery.min.js?v=oP6HI9z1XaZNBrJURtCoUT5SUnxFr8s3BzRl-cbzUq8:2:43184)
    at y.handle (jquery.min.js?v=oP6HI9z1XaZNBrJURtCoUT5SUnxFr8s3BzRl-cbzUq8:2:41168)
C @ kendo.all.js:318535
_createForm @ kendo.all.js:318535
_init @ kendo.all.js:318535
_click @ kendo.all.js:318535
dispatch @ jquery.min.js?v=oP6HI9z1XaZNBrJURtCoUT5SUnxFr8s3BzRl-cbzUq8:2
y.handle @ jquery.min.js?v=oP6HI9z1XaZNBrJURtCoUT5SUnxFr8s3BzRl-cbzUq8:2
However, because I'm using InCell editing, I have a ViewData object populated with my DropDown items (with the UI Hint), similar to the demo.  Is there any way around this?
Mike
Top achievements
Rank 1
Iron
Iron
 answered on 25 May 2023
1 answer
75 views

 

I'm using Trial for testing. But when the number of items is selected more, the text box displaying the item grows larger, breaking the interface of the page. I just want to show the number of selected items (Checked) to replace checked items, is it possible to process? Please guide how. Displays fine both when the event is selected and the initial default load of items is checked.

 

Example:

Mihaela
Telerik team
 answered on 24 May 2023
1 answer
426 views

I would like to create the following type of chart:

I have set the BaseUnit to weeks but the label prints as 10/31, 11/7, 11/14 etc

   @(Html.Kendo().Chart<FlightLog.Models.Charts.HoursByWeek>()
        .Name("chart")
        .Theme("bootstrap")
        .Title("Monthly Hours")
        .Legend(legend => legend
        .Position(ChartLegendPosition.Bottom)
        )
        .DataSource(ds => ds
        .Read(r => r.Url(Url.Page("./DashBoard", "HoursPerWeek")).Type(HttpVerbs.Post))
        )
        .Series(series =>
        {
            series.Column(model => model.Hours).CategoryField("Date");
        })
        .CategoryAxis(axis => axis.Date()
        .Labels(labels => labels.Rotation(-45))
        .Labels(labels => labels.DateFormats(dateFormat => dateFormat.Months("MMM")))
        .BaseUnit(ChartAxisBaseUnit.Weeks)

        .MajorGridLines(lines => lines.Visible(false))
        )
        .ValueAxis(axis => axis
        .Numeric()
        .Line(line => line.Visible(false))
        .MajorGridLines(lines => lines.Visible(true))
        )
        )

Mihaela
Telerik team
 answered on 24 May 2023
1 answer
200 views

Hi,

I have a use case where a user can click on a link or button in a parent record in a Kendo Grid, which causes a Kendo Window to become visible and display within it another Kendo Grid listing the child records corresponding to the record clicked in the parent page.   In this case, the parent  Grid would display a list of Document records;  When the user clicks on a link or button in the row of a particular Document,  a Window pops up with the Version History records for the Document in another Grid. 

Should the Version History Grid be in a partial view, as suggested in https://stackoverflow.com/questions/28772589/load-kendo-grid-in-kendo-window, and then brought into the Window, which is constructed in JavaScript, or is there a better/more standard approach, preferably one that uses html helpers? 

Also, how do I set  it up so that the Grid in the Window only displays Version History pertaining to the Document that was clicked?

If anybody has links to examples/samples that I can research, or can answer my questions, I'd be most appreciative.  I think that similar use cases just use the Grid Hierarchy, but unfortunately it's not an option for my use case.

Thanks!

Taylor

 

Stoyan
Telerik team
 updated answer on 23 May 2023
1 answer
281 views
I have a request to add SharePoint document management to an existing ASP .NET Core web application and since the project already has Telerik UI in it I'd like to use the File Manager component. I can't find any samples or guidance on how I would attempt to achieve this. Is it even possible? 
Alexander
Telerik team
 answered on 23 May 2023
1 answer
353 views

I have a tab strip with several tabs that contains various input fields for a user to modify and I'd like to show some sort of "edit" icon in the header of those tabs which have been modified to give the user a more visual indication of what has been changed before they save any changes.

I can see from the docs that you can set "ImageUrl" or "SpriteCssClasses" on a tab header when setting it up, but in this case, I'm looking at adding/removing images based on changed events from the widgets contained within the tab and can't seem to find any documented way of doing this.

Playing around with things I can do something like the following (where #TabStrip is the name given to my tab strip widget) to add a pencil icon to the header:

$("#TabStrip-tab-1 .k-link").prepend("<span class=\"k-icon k-i-edit\"></span>")

Which will give the following:

This is what I'm after, but I'm ideally looking for a way that is more "official" and supported rather than having to poke around inside the DOM of the tab strip itself.

Is there anything that could be used here or is that JS snippet above the best way to do this?

Aleksandar
Telerik team
 answered on 22 May 2023
1 answer
99 views

I'm having problem setting culture in a calendar called from Grid.
Below is my sample:

<script>
     kendo.culture("@Model.userSetting.culture");
</script>

....

       @(Html.Kendo().Grid<MyProject.Model.ModelName>()
                        .Name("gTasks")
                        .Columns(columns =>
                        {
                            columns.Bound(p => p.Id).Width(100).Visible(false);
                            columns.Bound(p => p.taskID).Width(100).Visible(false);
                            columns.Bound(p => p.Start).Format("{0:" + Model.userSetting.dateFormat + "}").Sortable(true).Width(100).Title("Start").EditorTemplateName("GridCalendarTemplate");
                            columns.Bound(p => p.End).Format("{0:" + Model.userSetting.dateFormat + "}").Sortable(true).Width(100).Title("End").EditorTemplateName("GridCalendarTemplate");
                         })
)

....



   

 

In Views/Shared/EditorTemplates/GridCalendarTemplate.cshtml


@model DateTime?
@{
    var culture = Context.Session.GetString("culture");

}
<script>
    kendo.culture("@culture");
</script>
@(Html.Kendo().DatePickerFor(m => m)
    .Culture("@culture")
    .HtmlAttributes(new { title = Html.ViewContext.ViewData.TemplateInfo.GetFullHtmlFieldName("") }))
Unfortunately, the calendar format does not accept culture "pl-PL"
Jacek
Top achievements
Rank 2
Iron
Iron
Iron
 answered on 21 May 2023
Narrow your results
Selected tags
Tags
+? more
Top users last month
Jay
Top achievements
Rank 3
Bronze
Iron
Iron
yw
Top achievements
Rank 2
Iron
Iron
Stefan
Top achievements
Rank 2
Iron
Iron
Iron
Kao Hung
Top achievements
Rank 1
Iron
Bohdan
Top achievements
Rank 2
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Jay
Top achievements
Rank 3
Bronze
Iron
Iron
yw
Top achievements
Rank 2
Iron
Iron
Stefan
Top achievements
Rank 2
Iron
Iron
Iron
Kao Hung
Top achievements
Rank 1
Iron
Bohdan
Top achievements
Rank 2
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?