Questions on UI for Blazor Forum

1 answer

107 views

Is it possible to use a ContextMenu inside a TelerikEditor? We're attempting to allow users to insert pre-selected phrases with a right-click menu.

ContextMenu

Editor

answered on 02 Mar 2023

3 answers

218 views

TelerikAutoComplete inside TelerikGrid

Hello,

Blazor WebApp here.

I try TelerikAutoComplete inside a TelerikGird without success. Do you provide a complete example so I can use it?

How I can get the current field value as searchTerm to send it to the API?

<GridColumn OnCellRender="@((GridCellRenderEventArgs args) => OnCellInfosEmplacementDestinationRenderHandler(args, "emplacementDescriptionCompleteFr"))" Field=@nameof(treltlkpEmplacementViewModel.emplacementDescriptionCompleteFr) Title="Description FRANÇAISE" TextAlign="@ColumnTextAlign.Left" >
        <Template>
            <TelerikAutoComplete TItem="@String"
                Id="TitreFr"
                ScrollMode="@DropDownScrollMode.Scrollable"
                ItemHeight="30"
                PageSize="10"
                OnRead="@OnReadAutoCompleteEmplacementDescriptionCompleteFr"
                @bind-Value="@((context as treltlkpEmplacementViewModel).emplacementDescriptionCompleteFr)"
                FillMode="@Telerik.Blazor.ThemeConstants.AutoComplete.FillMode.Solid">
                <AutoCompleteSettings>
                    <AutoCompletePopupSettings Height="100px" />
                </AutoCompleteSettings>
            </TelerikAutoComplete>
        </Template>
</GridColumn>

    async Task OnReadAutoCompleteEmplacementDescriptionCompleteFr(AutoCompleteReadEventArgs args)
    {
        treltlkpEmplacementViewModel item = (treltlkpEmplacementViewModel)args.Data;

        if (!string.IsNullOrWhiteSpace(?????????))
        {
            await ObtenirEmplacementDescriptionCompleteAutoCompleteAsync(args, SafetyStudioSolution.Shared.Constants.cultureNameFr, ?????????);
        }
    }

Thank you for your fast answer.

AutoComplete

Grid

answered on 01 Mar 2023

1 answer

1.0K+ views

Grid cell clicked on?

I have a need to be able to click on a cell and then capture the value in that cell in codebehind.

How can I do that?

I tried to play around with Column Template but I am getting no where. :(

Need a GridCell_OnClick event so I can grab the cell value the Row tis on and the Column tis in.

Thanks

Deasun.

Grid

answered on 01 Mar 2023

1 answer

90 views

Telerik.DataSource DataSourceRequest

Hi:

I want to create a blazor crud using DataSource with entity framework. Do you have a sample code?

I found a lot of samples to get data, filter, etc., but not for crud operations using Data Source.

Thanks in advance.

Grid

answered on 28 Feb 2023

1 answer

145 views

Reduce the width of the Group Cell

Hi,

I'm looking for a way to reduce group-cell width for the whole grid. I found the css class ( )

<td class="k-table-td k-group-cell" role="gridcell"></td>

But i can' figure out how to do . Here's a picture

Can u help me ?

Grid

answered on 28 Feb 2023

1 answer

260 views

Telerik FileSelect doesn't upload local files above a certain size threshold

Hello! I want to import .json files from my local machine using FileSelect:

<TelerikFileSelect AllowedExtensions = "@AllowedExtensions" MaxFileSize="@MaxFileSize" OnSelect = "@OnFileSelectHandlerTest"></TelerikFileSelect>

The maximum file size is set to 4MB and the OnSelect function is as defined below, which is pretty much the example given at Blazor FileSelect - Events - Telerik UI for Blazor:

    async Task OnFileSelectHandler(FileSelectEventArgs args)
    {
        foreach (var file in args.Files)
        {
            var byteArray = new byte[file.Size];
            await using MemoryStream ms = new MemoryStream(byteArray);
            await file.Stream.CopyToAsync(ms);
        }
    }

The method works fine for very small documents, below +- 26KB. Above this threshold, the app warns that it is attempting to reconnect to server and, after a couple of seconds, no document appears which suggests that the application gets stuck awaiting the CopyToAsync. The rest of the application (outside the FileSelect component) still works, but I can no longer add new files or remove the ones already selected. Has anyone been experiencing this problem and managed to solve it? (the same happens if I first create a local file and copy asynchronously into it)

Thank you

FileSelect

answered on 28 Feb 2023

1 answer

237 views

Blazor Hybrid and sharing components

I'm looking in to using Blazor Hybrid (inside a WPF wrapper) as an alternative to full traditional WPF in the next iteration of our software.

I have a blazor webassembly site and want to share components etc. within both applications (Blazor Hybrid and Blazor Webassembly).

I currently have the following:

Software.Client (webassembly)
Software.Server (webassembly backend)
Software.Local (blazor hybrid wpf)

I want to add a component library that both the hybrid and webassembly applications can use to share ui.

I have tried a few methods of doing this, using the telerik blazor components, but have ran in to a few road blocks specifically

Razor Class Library (couldn't use nuget ui to add the telerik ui blazor library)

Before I go much further how supported is the Blazor Hybrid scenario within an WPF wrapper using the telerik blazor library? Are there any examples I can use to move forward?

Any advice would be welcome.

Many thanks,

Rob

General Discussions

answered on 28 Feb 2023

1 answer

749 views

Blazor Grid Showing Error When Using GridToolBarTemplate

I was trying out a Telerik Blazor project and I am getting an error "Severity Code Description Project File Line Suppression State
Error (active) RZ9996 Unrecognized child content inside component 'TelerikGrid'. The component 'TelerikGrid' accepts child content through the following top-level items: 'GridAggregates', 'GridColumns', 'GridToolBar', 'GridExport', 'DetailTemplate', 'GridSettings', 'RowTemplate', 'NoDataTemplate'. I didn't change anything and it gives me this error. I am using Telerik UI for Blazor 3.6.1. Thanks.

Grid

answered on 27 Feb 2023

1 answer

175 views

Multiselect as single

I'm using this syntax:
<TelerikMultiSelect Class="searchSurveyor" ClearButton="true" OnRead="ReadItems" Filterable="true" Placeholder="Search Surveyor" OnChange="SetSurveyors"
                                Width="100%" Data="@_surveyorsData" TextField="TextField" ValueField="ValueField"
                                @bind-Value="_selectedSurveyorsData">

</TelerikMultiSelect>

I want to make it act like a single select where the last selected value replaces the first. But manipulating the bind-value doesn't seem to help
        private async void SetSurveyors(object theUserInput)
        {
            if (theUserInput == null) return;

            _selectedSurveyorsData = (List<string>)theUserInput;
            if (_selectedSurveyorsData.Count > 1)
            {
                _selectedSurveyorsData[0] = _selectedSurveyorsData[1];
                _selectedSurveyorsData.RemoveAt(1);
            }

        }
Any idea?

MultiSelect

answered on 27 Feb 2023

1 answer

302 views

Autofit not working

Hey,

I have a grid with columns that are being generated dynamically on load based on a dynamic object. Everything is loading ok, but for some reason the AutoFitAllColumnsAsync doesn't seem to be working. I can't even resize the individual columns using the mouse.

I am loading 117 pages (15 rows per page) of data, but the sorting works fine. Is there any reason you can think of that the resizing wouldn't work?

Here is my grid code

TelerikGrid @ref="@Grid"
             Data="@GridData" 
             Pageable="true"
             @bind-PageSize="@PageSize"
             Sortable="true"
             FilterMode="GridFilterMode.None"
             Resizable="true"
             Reorderable="true"
             EditMode="GridEditMode.None"
             Navigable="true"
             Class="slim-grid-paddings">
    <GridSettings>
        <GridPagerSettings InputType="PagerInputType.Input"
                           PageSizes="@_appSettings.PageSizes"
                           ButtonCount="5"
                           Adaptive="true">
        </GridPagerSettings>
    </GridSettings>
    <GridToolBarTemplate>
        <GridCommandButton Command="custom" Icon="@FontIcon.MaxWidth" Size="sm" OnClick="@(() => Grid.AutoFitAllColumns())">Auto-fit</GridCommandButton>
        <span class="k-toolbar-spacer"></span>
        <GridCommandButton Command="ExcelExport" Icon="@FontIcon.FileExcel" Size="sm">To Excel</GridCommandButton>
        <span title="Searches the items in the below grid." class="tooltip">
            <GridSearchBox DebounceDelay="200" Placeholder="Search" Size="sm" Fields="@SearchFields"></GridSearchBox>
        </span>
    </GridToolBarTemplate>
    <GridColumns>
        @if (GridData != null && GridData.Any())
        {
            var firstItem = GridData.First();
            var dictionaryItem = (IDictionary<string, object>)firstItem;

            var fields = dictionaryItem.Keys;

            foreach (var item in dictionaryItem)
            {
                <GridColumn Field="@item.Key" FieldType="@typeof(string)"></GridColumn>
            }
        }
    </GridColumns>
</TelerikGrid>

Grid

answered on 24 Feb 2023