Hello there,

I encountered an issue with the TelerikGrid component. This started to be an issue from version 4.1.0 and can be reproduced from here:

https://docs.telerik.com/blazor-ui/components/grid/columns/visible#toggle-the-visibility-of-a-column-on-button

If this line from the example:

<GridColumn Field=@nameof(SampleData.Name) Title="Name" />

<GridColumn Field=@nameof(SampleData.Name) Title="Name" Visible="@!isVisible">
    <Template>
       @((context as SampleData).Name)
     </Template>
</GridColumn>

Hello,

 new version has broken "dynamic" changing column properties/visiblity runtime, especially- selection mode and causing lot of "rerendering".

Video attachment:
1 - first part is OLD version(prior 4.1.0) 4.0.1
2 - seccond part(after changing next browser tab) is new version 4.1.0

SAME setup
Iam already using hint for blazor with IDs of columns, found in Your documentation...etc. @key="@("sIDX")"

.....
-->>Clicking on Button for changing grid mode and visibility of columns**
<TelerikToggleButton Title="Oznaceni vice radku" Icon="@FontIcon.ListUnordered" OnClick="@( _  =>{ CurrentStackItem.gSelectionMode=(CurrentStackItem.gSelectionMode==GridSelectionMode.Multiple)?GridSelectionMode.Single:GridSelectionMode.Multiple;CurrentStackItem.gSelectedItems = Enumerable.Empty<ExpandoObject>();})"
				Selected="@(CurrentStackItem.gSelectionMode==GridSelectionMode.Multiple)"></TelerikToggleButton>
....
<GridColumns>
-->>First "static" 2 columns**
<GridCheckboxColumn Visible=@(CurrentStackItem.gSelectionMode==GridSelectionMode.Multiple) @key="@("sIDX")" Width="70px" Locked="true" SelectAll="true" SelectAllMode="GridSelectAllMode.Current"></GridCheckboxColumn><GridColumn FieldType=@typeof(bool) Visible=@(IsPicker==true || (XSmall==false && CurrentStackItem.gSelectionMode==GridSelectionMode.Single )) @key="@("sCMD")" Filterable="false" Sortable="false" Locked="true" Width="@((IsPicker==true && XSmall==true)?"45px":"120px")">
			<HeaderTemplate>&nbsp;</HeaderTemplate><Template Context="ctx"><div @onclick:preventDefault="true" @onclick:stopPropagation="true">

-->> THIS part is hitting LOT OF TIME in debug (expected is at best only once)
				@{if (XSmall==false)
					{
-->> here is LOT OF dynamic buttons.

				}
					</div></Template></GridColumn>

-->> rest of the dynamic columns. In video, starting with "ciiislo org" in header

			@if (GridDef.ColStore != null && GridDef.ColStore.Any())
			{
				foreach (var it in GridDef.ColStore.Where(x => x.Verejny == true))
				{
					<GridColumn @key=@it.FldName Field=@it.FldName FieldType=@it.FldType Title=@it.VerejnyNazev ShowFilterCellButtons="false" Width=@it.cSirkaSestava
					TextAlign=@it.cZarovnani 
					><FooterTemplate>
							@if (it.Sumovat == true)
							{
								@context.Sum
							}
						</FooterTemplate></GridColumn>
				}
			}
		</GridColumns>

Feel free to change the Subject.

Thanks, have a nice day

First, let me thank you for adding the Width in the latest update (2.21). Much appreciated! 

https://www.w3schools.com/tags/tag_textarea.asp

We need a fixed height for our text areas to encourage user-interaction and ease the UX for the end user. Having (now a wide), but very narrow description field is not ideal and since it's basically a feature of HTML5, I don't see why it be exempt from Blazor UI.

<TelerikTextArea Rows="10" Width="100%" />

When is Spreadsheet for Blazor available or can i use Kendo Spreadsheat?

Regards

Alois Seidler 

Hi,

I would like to be able to show / hide a serie by clicking to a legend.

Is there a way to do it actually ?

When I change the field from the dropdown to another field of the same type, the filter editor is not updated.

The issue occurs when I'm using Enum fields - the dropdown editor is not updated to display the correct values of the newly selected Enum field.

Reproduction: https://blazorrepl.telerik.com/QHExPalR55jvaD1t12.

Steps to reproduce:

1. Select NumberField
2. The dropdown editor still shows the Color values

Is a ListBox control, similar to https://demos.telerik.com/aspnet-core/listbox/index, on the roadmap currently?

---

ADMIN EDIT

You can use a grid that has 1 column for the text you want to show with selection and perhaps even row dragging, and maybe hide its headers with css if you do not want them.

---

Greetings!

I've been waiting for a few months now to swap to blazor, but one of the things that's currently holding us back is that the filter row can't be used together with the column menu.
I've always found this to be strange, since it's supported in the Angular and MVC versions, which we currently use.
Our users never filter via the column menu, always via the filter row. They hide/lock their columns via the column menu and sometimes sort.
This functionality is thus critical for us.

I can't find any feature request for it, nor any planned roadmap item.
Will this ever be supported because if not, we're gonna have to start looking for alternatives.

Kind regards.

Currently, you can split the TelerikForm into multiple columns via the Columns parameter. These columns will have equal widths. I would like to have the ability to define custom width per column. 

<AdminEdit>

You can use the following code snippet as a workaround with some considerations:

• The k-grid-cols-2 class is a dynamic one. The "2" segment maps to the number of the columns defined via the Columns parameter exposed for the <TelerikForm>
• If there are more/less than two columns, you should change the values for the grid-template-columns accordingly.

<style>
    .non-equal-columns .k-form-layout.k-grid-cols-2 {
        grid-template-columns: 71% 28.5%;
    }
</style>

@using System.ComponentModel.DataAnnotations

<TelerikForm Model="@person" ColumnSpacing="25px" Columns="2" Class="non-equal-columns">
    <FormValidation>
        <DataAnnotationsValidator></DataAnnotationsValidator>
    </FormValidation>
    <FormItems>
        <FormGroup LabelText="Personal Information" ColumnSpacing="15px">
            <FormItem LabelText="First Name" Field="@nameof(Person.FirstName)"></FormItem>
            <FormItem LabelText="Last Name" Field="@nameof(Person.LastName)"></FormItem>
            <FormItem LabelText="Age" Field="@nameof(Person.Age)"></FormItem>
            <FormItem LabelText="Email" Field="@nameof(Person.Email)"></FormItem>
        </FormGroup>
        <FormGroup LabelText="Employee Information" Columns="2" ColumnSpacing="15px">
            <FormItem LabelText="Company Name" Field="@nameof(Person.CompanyName)"></FormItem>
            <FormItem LabelText="Position" Field="@nameof(Person.Position)"></FormItem>
        </FormGroup>
    </FormItems>
</TelerikForm>

@code {
    public Person person { get; set; } = new Person();

    public class Person
    {
        [Required(ErrorMessage = "The First name is required")]
        public string FirstName { get; set; }
        [Required(ErrorMessage = "The Last name is required")]
        public string LastName { get; set; }
        [Range(18, 120, ErrorMessage = "The age should be between 18 and 120")]
        public int Age { get; set; }
        [Required]
        [EmailAddress(ErrorMessage = "Enter a valid email")]
        public string Email { get; set; }
        [Required]
        public string CompanyName { get; set; }
        [MaxLength(25, ErrorMessage = "The position can be maximum 25 characters long")]
        public string Position { get; set; }
    }
}

</AdminEdit>

Hello,

I'm trying to add image previewing to our .Net 6.0.8 Blazor Wasm app using the Telerik Blazor UI FileSelect component. I'd like to be able to create a local url for previewing and also hold onto the file's contents for saving later. There currently doesn't seem to be any great examples/references for doing this using the Telerik FileSelect locally. So, I started looking at the official MS Blazor documentation around images, file uploads and downloads - the most relevant content seemed to be around giving a file's stream to a DotNetStreamReference, then handing it off to JS interop to create a URL from a Blob.

It was already quite slow when testing with a 4KB~ image, but became absolutely unusable once testing things with a larger 4MB~ image. To rule out the Telerik FileSelect's involvement I started testing with the native Blazor FileInput component. I noticed that the sending the DotNetStreamReference to JS interop took a long time itself and learned that .Net 6 added the ability to pass a byte[] almost instantly to JS interop. I was then able to see image previews quickly using the native FileInput component while hosting a file from a byte[]. With this new knowledge in hand I attempted to migrate this new workflow over to the Blazor FileSelect component, but unfortunately there doesn't seem to be a faster way to get a byte[] from the FileSelectFileInfo's Stream.

I'm seeing similar performance issues between the native FileInput using a stream and the Telerik FileSelect using a stream or byte[]. These are both taking around 4-5 minutes to host a file with a locally generated url and preview the image. In contrast I'm seeing wait times around 3-12 seconds using the native FileInput/IBrowserFile, this

byte[] iBrowserFileBytes = new byte[iBrowserFile.Size];
await iBrowserFile.OpenReadStream(maxFileSize).ReadAsync(iBrowserFileBytes);

Please see the attached Blazor Wasm code to recreate the issue. I've included 6 file inputs to test out the difference in performance between each scenario, but the most important file input is the "Blazor InputFile - HostFromByteArray" which shows the most promise. Attached is also the larger file that I was testing against. This might be a bug or maybe I'm just not reading from the FileSelectFileInfo's Stream in the most efficient way.

The only relevant code not attached is likely just this one from Program.cs:

// ...
builder.Services.AddSingleton<IJSInProcessRuntime>(services => (IJSInProcessRuntime)services.GetRequiredService<IJSRuntime>());
// ...

This request is for allowing to open other document types in PDF Viewer - for example, Word, Excel. The functionality will target viewing only and not editing.

1. Handle the OnOpen event to get the file bytes
2. Use the appropriate format provider of the RadSpreadProcessing library to import the Word/Excel file
3. Export the file with the PdfFormatProvider
4. Pass the converted file to the PDF Viewer to display it

Note: We've registered a bug with this solution. The PDF Viewer does not open other types of documents from the FileSelect in the Toolbar, they can be opened only on initialization of the component. Currently, the bug is in our backlog. Once fixed, the above-listed solution can be used to configure the PDF Viewer for viewing other document types. A knowledge base resource will be published on the matter.