I'm in the process of rewriting all Kendo components to use CSP compatible templates. I'm looking at https://docs.telerik.com/aspnet-core/html-helpers/template/overview which shows how we'd use TemplateComponentName() for popup editors and that we would need to rewrite everything in the popup editor to use Kendo Template's AddHtml or AddComponent methods.
Original:
<div class="mb-2 row required">
@Html.LabelFor(model => model.FileName, new { @class = "col-sm-4 col-form-label fw-bold text-sm-end" })
<div class="col-sm-6">
@(Html.Kendo().TextBoxFor(model => model.FileName).HtmlAttributes(new { @class = "w-100" }))
</div>
</div>
<div class="mb-2 row">
@Html.LabelFor(model => model.FileDescription, new { @class = "col-sm-4 col-form-label fw-bold text-sm-end" })
<div class="col-sm-6">
@(Html.Kendo().TextBoxFor(model => model.FileDescription).HtmlAttributes(new { @class = "w-100" }))
</div>
</div>
Rewritten:
@(Html.Kendo().Template()
.AddHtml("<div class='mb-2 row required'>")
.AddHtml(@<text>
@Html.LabelFor(model => model.FileName, new { @class = "col-sm-4 col-form-label fw-bold text-sm-end" })
</text>)
.AddHtml("<div class='col-sm-6'>")
.AddComponent(c => c.TextBoxFor(model => model.FileName).HtmlAttributes(new { @class = "w-100" }))
.AddHtml("</div></div>")
.AddHtml("<div class='mb-2 row'>")
.AddHtml(@<text>
@Html.LabelFor(model => model.FileDescription, new { @class = "col-sm-4 col-form-label fw-bold text-sm-end" })
</text>)
.AddHtml("<div class='col-sm-6'>")
.AddComponent(c => c.TextBoxFor(model => model.FileDescription).HtmlAttributes(new { @class = "w-100" }))
.AddHtml("</div></div>")
)While this works, this markup seems much harder to read than the original. Could this be made to be simpler? Ideally I'd like to be able to drop my existing mix of html and kendo components in one method and it'd parse through to render the template properly.
If I set the id directly in the HTML attributes for a checkbox, then the result when rendered has duplicate input elements with the same ID in the DOM.
Below is an example of this
ASP.NET Core REPL - ASP.NET Core Components Playground & Testing - Telerik
This issue does not exist on any of the other Telerik controls that
we've used (as far as I'm aware). This includes ones where there are two
inputs - one for selecting a value and the other for storing it e.g.
ComboBox
https://netcorerepl.telerik.com/wfuoYWkZ40lQM5hY39
or similarly for NumericTextBox
https://netcorerepl.telerik.com/mfOIYikZ44Kr8qjU21
The
best solution would be to make checkboxes consistent with other
controls by preventing the IDs from being duplicated when the property
is set.
Currently, the Editor's ImageBrowser dataSource only uses the default name, size, and type fields: https://docs.telerik.com/kendo-ui/api/javascript/ui/editor/configuration/imagebrowser.schema.model.fields#imagebrowserschemamodelfields
Additional custom fields coming with the response (sent back to the client by the specified end point) are ignored and are not accessible in the ImageBrowser's dataSource.
I'm using an OData datasource to populate the grid. To make matters worse, the Autocomplete retrieves data for *all* of the grid columns. I'd say the default behavior should only retrieve the current column's data and preferably use OData groupby to limit the results to distinct values.
Interestingly, the CheckBoxList filter *is* populated from the current grid data, behaving as expected.
My page is attached and the issue is occurring in the detail grid where Server Filtering is disabled.
Currently, the DatePicker can be set to read-only mode by adding the "readonly" attribute through the HtmlAttributes() option or by calling the client-side readonly() method.
Is it possible to implement a built-in Readonly() option, so the DatePicker is initialized as read-only? For example:
@(Html.Kendo().DatePickerFor(m => m.StratDate)
.Readonly(true)
)
As a result of an EF Core issue, the ToDataSourceResult() is not able to perform the query when the DataSourceRequest object contains grouping.
The problem occurs using the query below, assembled by Telerik routine:
var temp = _db.Pessoa
.OrderBy(item => item.Email)
.Skip(0)
.Take(40)
.GroupBy(item => item.Email)
.OrderBy(g => g.Key)
.Select(g => new AggregateFunctionsGroup
{
Key = g.Key,
ItemCount = g.Count(),
HasSubgroups = false,
Member = "Email",
AggregateFunctionsProjection = new
{
Count_Referencia = _db.Pessoa
.Select(t => new
{
t.IdPessoa,
t.Referencia,
t.Nome_RazaoSocial,
t.Apelido_Fantasia,
t.CPF_CNPJ,
t.RG_IE,
t.Email
})
.OrderBy(item => item.Email)
.Where(item => item.Email == g.Key)
.Count()
},
Items = g
})
.ToList();In the routine where the AggregateFunctionsGroup is created, the Items property must not only be the query itself, but also the fields specified in the main Select. Or, the call to the Select() method must simply be added:
var temp = _db.Pessoa
.OrderBy(item => item.Email)
.Skip(0)
.Take(40)
.GroupBy(item => item.Email)
.OrderBy(g => g.Key)
.Select(g => new AggregateFunctionsGroup
{
Key = g.Key,
ItemCount = g.Count(),
HasSubgroups = false,
Member = "Email",
AggregateFunctionsProjection = new
{
Count_Referencia = _db.Pessoa
.Select(t => new
{
t.IdPessoa,
...
})
.OrderBy(item => item.Email)
.Where(item => item.Email == g.Key)
.Count()
},
Items = g.Select(t => new
{
t.IdPessoa,
...
})
})
.ToList();This way, the issue does not occur.
Is it possible to include TLD by default in email validation ?
The grid must allow changes to be made in specific cells, without those changes being committed/saved unless the user clicks on the "Save" button in the toolbar. Basically the users enter in some values for editable currency columns that aren't locked, and (without saving) some columns (both locked and not locked) that are not editable must be refreshed as the value in those cells depend on the edited column. Those cells have client templates and client footer templates which need to be used by whatever is refreshing their cells.
Having this functionality provided built-in will be a nice addition:
https://docs.telerik.com/kendo-ui/knowledge-base/grid-update-particular-row-without-refresh
Select the ID textbox and enter the value 1.
Tab to the Radio button by pressing the tab key.
Arrow right or down to change the selection to no.
Radio button triggers the validation error. Even though the option No is selected.
Currently, the Content function for Steps in a Wizard only accepts a string value (see API here).
This means that in order to add a partial view (bound to the current model and its properties), the most straightforward way I could find was to put the partial view (and any wrappers) in its own file and add an extension method "ToHtmlString()". For example:
@model MyModel
@(Html.Kendo().Wizard().Steps(step => {
step.Add().Content(Html.Partial("~/Path/To/View/Wrapper.cshtml", Model).ToHtmlString());
})
using Microsoft.AspNetCore.Html;
using System.IO;
public static class HtmlContentExtensions
{
public static string ToHtmlString(this IHtmlContent htmlContent)
{
if (htmlContent is HtmlString htmlString)
{
return htmlString.Value;
}
using StringWriter writer = new();
htmlContent.WriteTo(writer, System.Text.Encodings.Web.HtmlEncoder.Default);
return writer.ToString();
}
}In the Telerik TabStrip, a better approach is possible, as the Content for Items can take in a function which accepts Razor syntax (see API here). For instance:
@model MyModel
@(Html.Kendo().TabStrip().Items(tabstrip => {
tabstrip.Add()
.Content(@<div id="@Model.TabContainer" class="myTabWrapperClass">
@await Html.PartialAsync("~/Path/To/View.cshtml", Model)
</div>);
})
If we had the option to use the same approach with Wizard Steps, that would be ideal!
Serializing DataSourceResult when it contains several groups is significantly slower compared to serializing the object when no grouping is used. Consider ways to improve the performance. For more context and an example, see Ticket ID:
Current configuration: server-side filtering
Desired behavior:
- Grid searches are "anded" to any existing filters
- When the search box is cleared the pre-existing filters are retained
This should be applied when using a Telerik UI for ASP.NET Core Grid with PopUp Edit Mode.
It would be nice to extend dialog like office 365 right dialog ( docked to the right).
It would be nice to have a dropdown button with a container
Hi Team,
I would like to request that, when using endless scrolling for the ListView, to include a page indicator to let the user know what page their on when scrolling.
Thank you!