<GridColumns>
@if (Columns == null || Columns.Count == 0)
{
<GridColumn Resizable="true" Title="Data" FieldType="typeof(string)" />
}
else
{
@foreach (var column in Columns)
{
if (column.PreferredType != null)
{
<GridColumn Resizable="true" Field="@column.FieldName" Title="@column.Title" FieldType="column.PreferredType" />
}
else
{
<GridColumn Resizable="true" Field="@column.FieldName" Title="@column.Title" />
}
}
}
</GridColumns>
<TelerikGrid Data=@ViewModel.Requests
EditMode="@GridEditMode.Inline"
Height="50%"
Width="100%"
Resizable="true"
Pageable="true"
OnCreate="@ViewModel.CreateRequest"
OnUpdate="@ViewModel.UpdateRequest"
OnCancel="@ViewModel.CancelRequest"
OnDelete="@ViewModel.DeleteRequest"
PageSize=5>
The 300ms default transition time for popups is too long for our app, and I would like an option to set it globally. It looks great on demos, but turns the interface into a sludge for doing real work.
The original solution to https://feedback.telerik.com/blazor/1469662-way-to-modify-default-values-of-animations-such-as-duration-and-delay-for-a-component-such-as-combobox (from 2020) allowed a default animation speed through css.
However, with the new PopupSettings approach, animation speed is hard coded into the style attribute on the .k-popup, thwarting any attempts to override it globally. Adding PopupSettings to all components in our app is hardly a workable solution. The only workaround I've figured out so far is to disable animations on .k-popups alltogether (by adding a "transition: none" to .k-input)
Hi!
Would it be possible to expose a focus in/out (or similar) functionality for the Treeview? We currently use the component for eyebrow navigation menus, and it would be nice to have the ability to close trees when the user clicks somewhere else. We've tried doing an onclick for the body of the site, which works but also interferes with other clicks on the page. Thanks!
It seems to me on a greenfield app where someone wants the ability to switch themes, 99% of the time they would want it site wide, not just on your components. I'd venture a guess that most of us c# .Net devs moving to Blazor, don't have Ed C and your organization's sass skills. If that were built into a template used by your Visual Studio Extension Create Project Wizard it would allow us to focus more on the business logic and probably increase adoption of Theme Builder Pro
Thanks,
Kurt
Hi,
I'm in the process of implementing a form in a Window component and would like the content to remain present in the DOM between hiding and showing of the window. I noticed that there's a line in the documentation where it states that PersistContent will allow the content of the window to remain in the DOM whenever the window is minimized. I recommend this be extended to the Visibility of the form, not just minimizing, as to create a more coherent approach.
I did come across this post here where it gives a description of how the above is achieved. This is a very inelegant approach as the consumer of the framework has to manually implement stuff which should be provided by the framework. The suggested approach also prevents the developer from opening multiple windows at once, which might be an issue in some cases.
Currently, the AdaptiveMode.Auto in Blazor Hybrid has to be defined at the component level.
It would be nice if it could be globally defined at the TelerikRootComponent level.
As an additional possibility...
The current ASP.NET Ajax Telerik Controls, there is a property for Rendering -- Lightweight mode, Classic mode, etc. This can be defined at the control level, the custom control level, the page level and globally in web.config.
It would be great if this property AdaptiveMode could be defined in a similar way -- control level, custom Blazor component level, Razor page level or global level. If I understand correctly, much of the specific CSS styling can be done at different levels in Blazor. This would be similar.
Regards,
Dennis
When downloading files via the TelerikPdfViewer bytes are added before and after the PDF Dokument.
Browsers are able to show the documents but you get and error message if you try to open the downloaded document in Acrobar Reader or in a DMS.
The document attached was download from the demo on your web site.
https://docs.telerik.com/blazor-ui/components/grid/paging
Under the section "Bind Page Size to a variable", if you click preview it generates an error.
Peter
Hello
Just seeing if it would be easy to separate the "StockChartNavigator" component that currently sits within the "TelerikStockChart" component.
So in other words, have a generic "ChartNavigator" component; the navigator is very good as a standalone and could be applied to many things such as grids, non-telerik charts (not only stock data) etc.
Alternatively, if there were a way to override the chart template of the TelerikStockChart, that would achieve the same result?
Cheers
Phil
Hi,
I see this feature request which is marked as COMPLETED in v2.28 (I`m running v3.7) but I don`t see how to achieve the functionality of having a blank placeholder for a DateTimePicker which has a null datetime variable bound it.
Are you able to help please?
Regards,
Tom
If I create a <TelerikGrid> whose Data property is set to a collection of 'object' (actual type not known at compile time, only at runtime), I can create <GridColumn> components for each property through e.g.
@{
IEnumerable<PropertyInfo> props = GetModelType().GetProperties();
foreach (PropertyInfo prop in props)
{
string propName = prop.Name;
<GridColumn Field="@propName" ... />
}
}
@code {
private Type GetModelType()
{
Type modelType = ...; // code determines the type of model at runtime ...
return modelType;
}
}
This works fine if the grid's EditMode is GridEditMode.Popup. When editing a row, the popup dialog properly displays each column header and value and binds correctly.
However, this does not work if the EditMode is GridEditMode.Inline nor GridEditMode.Incell. When placing the row in edit mode, no editor control appears at all, and the value in the cell is displayed as blank.
The design of the grid component thus only works well when given a known type at compile time, or one is constrained to always use Popup edit mode due to this flaw.
In addition to a request to fix this, it would also be great if the grid could be passed a Type (a runtime type, not a class name) to use for generating columns automatically, rather than having to resort to developers having to use reflection to generate grid columns themselves.
For instance,
<TelerikGrid T="@GetModelType()" ...> should invoke the GetModelType() method which would return a type at runtime, not necessarily known at compile time. Currently T can only be set to a hard-coded type name such as "Employee".
My grid bind to ExpandoObjects, and I would like to implement a Group Header.
So I referenced these two documents
https://docs.telerik.com/blazor-ui/knowledge-base/grid-binding-to-expando-object
https://docs.telerik.com/blazor-ui/components/grid/columns/multi-column-headers
From the first document, it make sense to me that we need to set FieldType for each column that binds to ExpandoObject, but it seems this restriction also applies to the group header column, which does not make sense.
Foe example:
<TelerikGrid Data="@GridData"
Pageable="true"
Sortable="true"
FilterMode="@GridFilterMode.FilterRow">
<GridColumns>
<GridColumn Title="Test Group Header">
<Columns>
<GridColumn Field="PropertyInt" Title="Int Column" FieldType="@typeof(int)" />
<GridColumn Field="PropertyString" Title="String Column" FieldType="@typeof(string)" />
<GridColumn Field="PropertyDate" Title="DateTime Column" FieldType="@typeof(DateTime)" />
</Columns>
</GridColumn>
</GridColumns>
</TelerikGrid>
I get error:
I need to set FieldType on the "Test Group Header" column to an arbitrary value to get rid of this error.
Per API documentation, the Decimals property defaults to what is set in the user's region (culture). This is a flawed design.
Why would one think that ALL properties of type double or float in grid models should be truncated to 2 decimal places (when my region is set to US and that is the default)?
This seriously limits property values. Not everything is a dollar and cent value! The region setting I believe is for how to format general currency values perhaps (I am not exactly sure what it is for, because there is a different tab for 'Currency' with a 'No. of digits after decimal' setting as well as the tab for 'Numbers' having the same thing. But this does not mean that Windows always formats numbers that way.
Suppose for example I have a property in my model named "Weight" (expressed in terms of pounds). The value 150.12345 (pounds) is perfectly valid. It should not be truncated to 150.12. Or another, "Length" (expressed in terms of Feet): 17.0625 (that's 17 feet, 1 inch) - should not be morphed into 17.06.
To work around this, developers currently either have to override a <GridColumn>'s <EditorTemplate> and place a <TelerikNumericTextBox> element bound to the same property that the <GridColumn> is, and explictly set the Decimals property themselves.
Or what I have found is a better workaround, although not desirable to have to do this at all, is to put this kind of code snippet in the Program.cs file, right after the line var app = builder.Build();
app.UseRequestLocalization(action =>
{
var currentCulture = CultureInfo.CurrentCulture.Clone() as CultureInfo;
currentCulture!.NumberFormat.NumberDecimalDigits = 10; // for example, to allow this many decimal places in everything numeric
var cultures = new List<CultureInfo>() { currentCulture };
action.SupportedCultures = cultures;
});
Please remove the default value for the Decimals property being tied to the culture. It should just allow as many decimal places as a normal float or double would allow for its precision. Perhaps just allow a developer to set it and honor that, but if not set, basically let it be unlimited, just like the number of digits to the left of the decimal point.
While using Safari browser, I am getting following exception message:
SyntaxError: Unexpected private name #a. Cannot parse class method with private name.
I saw a few other posts that requested this feature which in all of the cases was denied saying to use Enabled instead...
The reason we need a ReadOnly state is because the user can not highlight to select the text to copy/paste if desired... that would be the reason we need ReadOnly vs disabled...
Disabled does not allow you to select the text to copy/paste...
---
ADMIN EDIT
A workaround is to re-enable the pointer events and to, optionally, set a highlight color:
<style>
/* Re-enable selection and scrolling of disabled textboxes.
Apply text selection style.
Can cause some side effects with appearance of hover and focus states */
/* UI for Blazor 3.0 + */
.k-input-inner.k-disabled,
.k-disabled > .k-input-inner,
input.k-textbox[disabled] {
pointer-events: initial;
}
.k-input-inner[disabled]::selection {
color: #fff;
background-color: #ff6358;
}
/* UI for Blazor 2.30 - */
.k-input.k-state-disabled,
.k-state-disabled > .k-input,
.k-state-disabled > .k-dateinput-wrap > .k-input,
input.k-textbox[disabled] {
pointer-events: initial;
}
.k-input[disabled]::selection {
color: #fff;
background-color: #ff6358;
}
</style>
<TelerikTextBox @bind-Value="@tbText" Enabled="false" />
<TelerikTextArea @bind-Value="@taText" Enabled="false" />
<TelerikDatePicker @bind-Value="@dpDate" Enabled="false" />
<TelerikDropDownList @bind-Value="@ddlVal" Data="@ddlData" Enabled="false" />
@code{
string tbText { get; set; } = "lorem ipsum";
string taText { get; set; } = "lorem ipsum\ndolor sit amet\nlorem ipsum\ndolor sit amet";
DateTime dpDate { get; set; } = DateTime.Now;
List<int> ddlData { get; set; } = Enumerable.Range(1, 10).ToList();
int ddlVal { get; set; } = 2;
}
---
Hello there,
I encountered an issue with the TelerikForm component after upgrading Telerik.UI.for.Blazor from version 4.0.1 to 4.4.0. In the code below I have placed the two form items in a Bootstrap grid:
<TelerikForm Model="@person">
<FormValidation>
<DataAnnotationsValidator></DataAnnotationsValidator>
</FormValidation>
<FormItems>
<div class="row">
<div class="col-md-6">
<FormItem Field="@nameof(Person.Id)" LabelText="Id"></FormItem>
</div>
<div class="col-md-6">
<FormItem Field="@nameof(Person.FirstName)"
EditorType="@FormEditorType.TextArea"
LabelText="First name">
</FormItem>
</div>
</div>
</FormItems>
</TelerikForm>
With version 4.0.1, the two fields were displayed in two columns within the form element. However, with version 4.4.0, I noticed that the HTML code, specifically the div elements, are now rendered outside of the form element. The HTML structure looks like this:
<div class="row">
<div class="col-md-6">
</div>
<div class="col-md-6">
</div>
</div>
<form class="k-form telerik-blazor k-form-md" dir="ltr" style="">
<div class="k-form-field">
<label class="k-label k-form-label" for="a6cc8103-4d52-4377-8656-169e4a3de33a">
Id
</label>
<div class="k-form-field-wrap">
......
I wanted to check with you if this change is intentional or if it might be a bug with the TelerikForm component in the latest version.
Best regards,
Ivaylo