I'm currently trying to integrate telerik tilelayout inside telerik tabstrip dynamically?

for example

        <TabStripTab Class="@(filteredRows.Any() ? GetTabWidth() : "auto")"  Title="@tabtitle1["tabtitle"].ToString()">
                 <TelerikTileLayout Columns="12"
               RowHeight="auto"
               Resizable="true"
               Reorderable="true">
<TileLayoutItems>
                    @foreach (DataRow row in filteredRows)
                    {

                        <_Data columnspan='Convert.ToInt32(row["columnspan"])' rowspan='Convert.ToInt32(row["rowspan"])' pageId="@pageId" oDt="row" encryptQueryString="@data"></_Data>
                    }
                </TileLayoutItems>
            </TelerikTileLayout>
                </TabStripTab>
            }                                   
            @if (filteredRows2.Any())
            {

        <TabStripTab Title="@tabtitle2["tabtitle"].ToString()">

            <TelerikTileLayout Columns="12"
                               RowHeight="auto"
                               Resizable="true"
                               Reorderable="true">
                <TileLayoutItems>
                    @foreach (DataRow row in filteredRows2)
                    {

                        <_Data columnspan='Convert.ToInt32(row["columnspan"])' rowspan='Convert.ToInt32(row["rowspan"])' oDt="row" data="@data"></_Data>
                    }
                </TileLayoutItems>
            </TelerikTileLayout>

                </TabStripTab>

when i set persist content to true it reloads the components which invoke the database calling ?I s there any way to do without component being refreshed?

Can we get a Switch and Checkbox theme color property similar to the rest of the components.

😀

I'm trying to convert an existing Blazor project to use Telerik components.  Following this article Convert Project Wizard but the Telerik UI for Blazor > Convert to Telerik Application menu option doesn't show up on either the project context menu or Extensions Menu in the Solution Explorer.

VS2022 V17.9.7

The fully licensed Telerik Extensions are installed in VS2022

The project file includes the package reference  <PackageReference Include="Telerik.UI.for.Blazor" Version="6.0.0" />

How do I get the Convert Project Wizard?

Thanks

Hello, I have the following requirement, I need to be able to re-order telerik grid columns programmatically.  I have come up with a simple sample project to demonstrate the need, but I've noticed that although it re-orders the columns the first time I press a button (see sample), it does not re-order the columns after that....something which I find very peculiar. Notice, I tried two approaches in re-ordering columns, one using simple rearrangement of <GridColumn>s and another is to muck around with Grid state object (_grid.GetState()).  Any help is greatly appreciated.

<div style="width: 100%; height: 100%">
    <TelerikGrid TItem="@Model"
                 FilterMode="@GridFilterMode.FilterRow"
                 SelectionMode="GridSelectionMode.Single"
                 EnableLoaderContainer="true"
                 
                 Pageable="false"
                 Sortable="true"
                 Height="100%"
                 OnStateChanged="OnStateChanged"
                 Data="Data"
                 @ref=@_grid>
        <GridColumns>
            @{
                foreach (var col in ColumnOrder)
                {
                    if (col == 1)
                    {
                        <GridColumn Field="@(nameof(Model.One))" FieldType="@(typeof(string))" Title="One Values"></GridColumn>
                    }
                    else if (col == 2)
                    {
                        <GridColumn Field="@(nameof(Model.Two))" FieldType="@(typeof(string))" Title="Two Values"></GridColumn>
                    }
                    else if (col == 3)
                    {
                        <GridColumn Field="@(nameof(Model.Three))" FieldType="@(typeof(string))" Title="Three Values"></GridColumn>
                    }
                }
            }
        </GridColumns>

    </TelerikGrid>
    <Button @onclick="ButtonClick1">Order Columns: 3,2,1</Button>
    <Button @onclick="ButtonClick2">Order Columns: 2,3,1</Button>
    <Button @onclick="ButtonClick3">Order Columns: 1,2,3</Button>
</div>

@code {
    private List<Model> Data = new();
    private int[] ColumnOrder = new[] { 1,2,3 };
    private TelerikGrid<Model> _grid;

    protected override void OnInitialized()
    {
        BuildData();
    }

    private void BuildData()
    {
        for (int i = 0; i < 10; i++)
        {
            Data.Add(new Model
            {
                One=$"One {i}",
                Two=$"Two {i}",
                Three=$"Three {i}",
            });
        }
    }

    private void ButtonClick1()
    {
        ColumnOrder = new[] { 3,2,1 };
        _grid.Rebind();
        StateHasChanged();
    }

    private void ButtonClick2()
    {
        ColumnOrder = new[] { 2, 3, 1 };
        _grid.Rebind();
        StateHasChanged();
    }

    private void ButtonClick3()
    {
        var state = _grid.GetState();
        var i = 0;
        foreach (var col in state.ColumnStates)
        {
            if (col.Field == "One") col.Index = 0;
            if (col.Field == "Two") col.Index = 1;
            if (col.Field == "Three") col.Index = 2;
        }
        //ColumnOrder = new[] { 1,2,3 };
        StateHasChanged();
    }

    private void OnStateChanged(GridStateEventArgs<Model> obj)
    {
        Console.WriteLine("StateChanged");
    }

    public class Model
    {
        public string One { get; set; }
        public string Two { get; set; }
        public string Three { get; set; }
    }
}

Hi, i need to design a class to handle pagination in my api endpoints, so i have a question about 2 properties of DataSourceRequest.

Page: I assume it's used only in pagination to set the page number.

Skip: I assume it's used only on virtual pagination to define the records to skip. 

I think this 2 properties as mutual exclusive (if used Page, Skip is ignored, if used Skip, Page is ignored).

Is this true or there are situations where are both used?  

and if one exclude the other... why you have not handled the pagination only with Skip / Take properties (assumed who Take correspond to PageSize in classic pagination, Page can be calculated as (Skip / Take) + 1)?

i need this answers because if this properties are multual exclusive i assume i can design my pagination class with only 2 properties (Skip / Take) instead of 3 (Page / PageSize / Skip) as done in DataSourceRequest object.

Thanks

Thanks

Hi there,

Is there a way to handle  the click anywhere on TelerikCard without wrapping it with a div and handling div.onclick?

Regards,

Igor

If i revert to 2024 Q1 the error disappears...

2024-05-16 19:54:03,530 [ERROR] Unhandled exception in circuit 'S77usknbj_EFjppCUa4yC1LlVuSlrA3J5HkaJib6jRs'.
Microsoft.JSInterop.JSException: Could not find 'TelerikBlazor.initListView' ('initListView' was undefined).
Error: Could not find 'TelerikBlazor.initListView' ('initListView' was undefined).
    at http://localhost:5242/_framework/blazor.server.js:1:734
    at Array.forEach (<anonymous>)
    at l.findFunction (http://localhost:5242/_framework/blazor.server.js:1:702)
    at _ (http://localhost:5242/_framework/blazor.server.js:1:5445)
    at http://localhost:5242/_framework/blazor.server.js:1:3238
    at new Promise (<anonymous>)
    at y.beginInvokeJSFromDotNet (http://localhost:5242/_framework/blazor.server.js:1:3201)
    at Xt._invokeClientMethod (http://localhost:5242/_framework/blazor.server.js:1:61001)
    at Xt._processIncomingData (http://localhost:5242/_framework/blazor.server.js:1:58476)
    at Xt.connection.onreceive (http://localhost:5242/_framework/blazor.server.js:1:52117)
   at Microsoft.JSInterop.JSRuntime.InvokeAsync[TValue](Int64 targetInstanceId, String identifier, Object[] args)
   at Microsoft.JSInterop.JSRuntimeExtensions.InvokeVoidAsync(IJSRuntime jsRuntime, String identifier, Object[] args)
   at Telerik.Blazor.Components.TelerikListView`1.InitListView()
   at Telerik.Blazor.Components.TelerikListView`1.OnAfterRenderAsync(Boolean firstRender)
   at Microsoft.AspNetCore.Components.RenderTree.Renderer.GetErrorHandledTask(Task taskToHandle, ComponentState owningComponentState)
2024-05-16 19:54:03,838 [WARN ] Unhandled exception rendering component: JavaScript interop calls cannot be issued at this time. This is because the circuit has disconnected and is being disposed.
Microsoft.JSInterop.JSDisconnectedException: JavaScript interop calls cannot be issued at this time. This is because the circuit has disconnected and is being disposed.
   at Microsoft.AspNetCore.Components.Server.Circuits.RemoteJSRuntime.BeginInvokeJS(Int64 asyncHandle, String identifier, String argsJson, JSCallResultType resultType, Int64 targetInstanceId)
   at Microsoft.JSInterop.JSRuntime.InvokeAsync[TValue](Int64 targetInstanceId, String identifier, CancellationToken cancellationToken, Object[] args)
   at Microsoft.JSInterop.JSRuntime.InvokeAsync[TValue](Int64 targetInstanceId, String identifier, Object[] args)
   at Microsoft.JSInterop.JSRuntimeExtensions.InvokeVoidAsync(IJSRuntime jsRuntime, String identifier, Object[] args)
   at Telerik.Blazor.Components.TelerikTextArea.SetJsValueAsync()
   at Telerik.Blazor.Components.Common.TextBoxBase.OnAfterRenderInternalAsync(Boolean firstRender)
   at Telerik.Blazor.Components.Common.TextBoxBase.OnAfterRenderAsync(Boolean firstRender)
   at Telerik.Blazor.Components.TelerikTextArea.OnAfterRenderAsync(Boolean firstRender)
   at Microsoft.AspNetCore.Components.RenderTree.Renderer.GetErrorHandledTask(Task taskToHandle, ComponentState owningComponentState)

When editing a text field on a Blazor Grid in inline edit mode, pressing the backspace key will cause the cell edit to cancel, similar to what the escape key does. To reproduce, enter edit mode and press the backspace key, or keep pressing the backspace key until  the edit cancels.

This is usual behavior since the backspace key is very often used to clear the text before entering new text and it is unexpected when pressing the key causes the edit to suddenly cancel. It there a way to prevent this unwanted behaviour?

Bryan