Hello everyone,

I have a TelerikTreeList inside a EditForm. When the page is loaded the first time everything works as expected. When reloading the page the TreeList fails with System.ObjectDisposedException: Cannot access a disposed object.

Here is the whole error message:

System.ObjectDisposedException: Cannot access a disposed object.
Object name: 'DotNetObjectReference`1'.
   at Microsoft.JSInterop.DotNetObjectReference`1.ThrowIfDisposed()
   at Microsoft.JSInterop.JSRuntime.TrackObjectReference[TValue](DotNetObjectReference`1 dotNetObjectReference)
   at Microsoft.JSInterop.Infrastructure.DotNetObjectReferenceJsonConverter`1.Write(Utf8JsonWriter writer, DotNetObjectReference`1 value, JsonSerializerOptions options)
   at System.Text.Json.Serialization.JsonConverter`1.TryWrite(Utf8JsonWriter writer, T& value, JsonSerializerOptions options, WriteStack& state)
   at System.Text.Json.Serialization.JsonConverter`1.TryWriteAsObject(Utf8JsonWriter writer, Object value, JsonSerializerOptions options, WriteStack& state)
   at System.Text.Json.Serialization.JsonConverter`1.TryWrite(Utf8JsonWriter writer, T& value, JsonSerializerOptions options, WriteStack& state)
   at System.Text.Json.Serialization.Converters.DictionaryOfTKeyTValueConverter`3.OnWriteResume(Utf8JsonWriter writer, TCollection value, JsonSerializerOptions options, WriteStack& state)
   at System.Text.Json.Serialization.Converters.DictionaryDefaultConverter`3.OnTryWrite(Utf8JsonWriter writer, TCollection dictionary, JsonSerializerOptions options, WriteStack& state)
   at System.Text.Json.Serialization.JsonConverter`1.TryWrite(Utf8JsonWriter writer, T& value, JsonSerializerOptions options, WriteStack& state)
   at System.Text.Json.Serialization.JsonConverter`1.TryWriteAsObject(Utf8JsonWriter writer, Object value, JsonSerializerOptions options, WriteStack& state)
   at System.Text.Json.Serialization.JsonConverter`1.TryWrite(Utf8JsonWriter writer, T& value, JsonSerializerOptions options, WriteStack& state)
   at System.Text.Json.Serialization.Converters.ArrayConverter`2.OnWriteResume(Utf8JsonWriter writer, TCollection value, JsonSerializerOptions options, WriteStack& state)
   at System.Text.Json.Serialization.Converters.IEnumerableDefaultConverter`2.OnTryWrite(Utf8JsonWriter writer, TCollection value, JsonSerializerOptions options, WriteStack& state)
   at System.Text.Json.Serialization.JsonConverter`1.TryWrite(Utf8JsonWriter writer, T& value, JsonSerializerOptions options, WriteStack& state)
   at System.Text.Json.Serialization.JsonConverter`1.WriteCore(Utf8JsonWriter writer, T& value, JsonSerializerOptions options, WriteStack& state)
   at System.Text.Json.JsonSerializer.WriteCore[TValue](JsonConverter jsonConverter, Utf8JsonWriter writer, TValue& value, JsonSerializerOptions options, WriteStack& state)
   at System.Text.Json.JsonSerializer.WriteCore[TValue](Utf8JsonWriter writer, TValue& value, Type inputType, JsonSerializerOptions options)
   at System.Text.Json.JsonSerializer.Serialize[TValue](TValue& value, Type inputType, JsonSerializerOptions options)
   at System.Text.Json.JsonSerializer.Serialize[TValue](TValue value, JsonSerializerOptions options)
   at Microsoft.JSInterop.JSRuntime.InvokeAsync[TValue](String identifier, CancellationToken cancellationToken, Object[] args)
   at Microsoft.JSInterop.JSRuntimeExtensions.InvokeVoidAsync(IJSRuntime jsRuntime, String identifier, CancellationToken cancellationToken, Object[] args)
   at Telerik.Blazor.Components.TreeList.TreeListHeaderRow`1.InitColumnReorderable()
   at Telerik.Blazor.Components.TreeList.TreeListHeaderRow`1.OnAfterRenderAsync(Boolean firstRender)
   at Microsoft.AspNetCore.Components.RenderTree.Renderer.GetErrorHandledTask(Task taskToHandle)
DEBUG Received hub invocation: InvocationMessage { InvocationId: "", Target: "OnRenderCompleted", Arguments: [ 3,  ], StreamIds: [  ] }.
ERROR Unhandled exception in circuit 'FJaH7LK7_TFBNO0Iti401Oi6ChhUWppLVwtrSUgHQ-A'.
System.ObjectDisposedException: Cannot access a disposed object.
Object name: 'DotNetObjectReference`1'.
   at Microsoft.JSInterop.DotNetObjectReference`1.ThrowIfDisposed()
   at Microsoft.JSInterop.JSRuntime.TrackObjectReference[TValue](DotNetObjectReference`1 dotNetObjectReference)
   at Microsoft.JSInterop.Infrastructure.DotNetObjectReferenceJsonConverter`1.Write(Utf8JsonWriter writer, DotNetObjectReference`1 value, JsonSerializerOptions options)
   at System.Text.Json.Serialization.JsonConverter`1.TryWrite(Utf8JsonWriter writer, T& value, JsonSerializerOptions options, WriteStack& state)
   at System.Text.Json.Serialization.JsonConverter`1.TryWriteAsObject(Utf8JsonWriter writer, Object value, JsonSerializerOptions options, WriteStack& state)
   at System.Text.Json.Serialization.JsonConverter`1.TryWrite(Utf8JsonWriter writer, T& value, JsonSerializerOptions options, WriteStack& state)
   at System.Text.Json.Serialization.Converters.DictionaryOfTKeyTValueConverter`3.OnWriteResume(Utf8JsonWriter writer, TCollection value, JsonSerializerOptions options, WriteStack& state)
   at System.Text.Json.Serialization.Converters.DictionaryDefaultConverter`3.OnTryWrite(Utf8JsonWriter writer, TCollection dictionary, JsonSerializerOptions options, WriteStack& state)
   at System.Text.Json.Serialization.JsonConverter`1.TryWrite(Utf8JsonWriter writer, T& value, JsonSerializerOptions options, WriteStack& state)
   at System.Text.Json.Serialization.JsonConverter`1.TryWriteAsObject(Utf8JsonWriter writer, Object value, JsonSerializerOptions options, WriteStack& state)
   at System.Text.Json.Serialization.JsonConverter`1.TryWrite(Utf8JsonWriter writer, T& value, JsonSerializerOptions options, WriteStack& state)
   at System.Text.Json.Serialization.Converters.ArrayConverter`2.OnWriteResume(Utf8JsonWriter writer, TCollection value, JsonSerializerOptions options, WriteStack& state)
   at System.Text.Json.Serialization.Converters.IEnumerableDefaultConverter`2.OnTryWrite(Utf8JsonWriter writer, TCollection value, JsonSerializerOptions options, WriteStack& state)
   at System.Text.Json.Serialization.JsonConverter`1.TryWrite(Utf8JsonWriter writer, T& value, JsonSerializerOptions options, WriteStack& state)
   at System.Text.Json.Serialization.JsonConverter`1.WriteCore(Utf8JsonWriter writer, T& value, JsonSerializerOptions options, WriteStack& state)
   at System.Text.Json.JsonSerializer.WriteCore[TValue](JsonConverter jsonConverter, Utf8JsonWriter writer, TValue& value, JsonSerializerOptions options, WriteStack& state)
   at System.Text.Json.JsonSerializer.WriteCore[TValue](Utf8JsonWriter writer, TValue& value, Type inputType, JsonSerializerOptions options)
   at System.Text.Json.JsonSerializer.Serialize[TValue](TValue& value, Type inputType, JsonSerializerOptions options)
   at System.Text.Json.JsonSerializer.Serialize[TValue](TValue value, JsonSerializerOptions options)
   at Microsoft.JSInterop.JSRuntime.InvokeAsync[TValue](String identifier, CancellationToken cancellationToken, Object[] args)
   at Microsoft.JSInterop.JSRuntimeExtensions.InvokeVoidAsync(IJSRuntime jsRuntime, String identifier, CancellationToken cancellationToken, Object[] args)
   at Telerik.Blazor.Components.TreeList.TreeListHeaderRow`1.InitColumnReorderable()
   at Telerik.Blazor.Components.TreeList.TreeListHeaderRow`1.OnAfterRenderAsync(Boolean firstRender)
   at Microsoft.AspNetCore.Components.RenderTree.Renderer.GetErrorHandledTask(Task taskToHandle)
DEBUG Received hub invocation: InvocationMessage { InvocationId: "", Target: "OnRenderCompleted", Arguments: [ 4,  ], StreamIds: [  ] }.
DEBUG Received hub invocation: InvocationMessage { InvocationId: "", Target: "EndInvokeJSFromDotNet", Arguments: [ 34, True, [34,true,null] ], StreamIds: [  ] }.

here is the code that has the treelist:

 <EditForm Model="@Disease" OnValidSubmit="@HandleValidSubmit" OnInvalidSubmit="@HandleInvalidSubmit">

        <DataAnnotationsValidator />
        <ValidationSummary />

        <div>
            <TelerikTextBox Title="Disease name" Label="Disease name" PlaceHolder="Enter disease name" @bind-Value="@Disease.name"></TelerikTextBox>
        </div>

        <div>
            <TelerikDropDownList Data="@Locale" TextField="Value" ValueField="Id" @bind-Value="selectedLocaleValue">
            </TelerikDropDownList>
        </div>


        <TelerikTreeList Data="@DataFields"
                         ItemsField="DirectReports"
                         HasChildrenField="HasReports"
                         Pageable="false"
                         Sortable="false"
                         FilterMode="@TreeListFilterMode.FilterMenu"
                         Width="850px" Height="800px"
                         Resizable="true" Reorderable="true"
                         OnUpdate="@UpdateItem"
                         OnDelete="@DeleteItem"
                         OnCreate="@CreateItem"
                         OnEdit="@OnEditHandler"
                         OnCancel="@OnCancelHandler"
                         EditMode="@TreeListEditMode.Inline">

            <TreeListColumns>

                <TreeListColumn Field="Value" Width="400px" Expandable="true" Title="Value"></TreeListColumn>
                <TreeListCommandColumn Width="200px" Context="diseasesParams">
                    @{
                        var item = diseasesParams as ListHierarchical;
                        if (item.HasChildren)
                        {
                            <TreeListCommandButton Command="Add" Icon="plus">Add Child</TreeListCommandButton>
                        }
                        if (item.IsEditable)
                        {
                            <TreeListCommandButton Command="Edit" Icon="edit">Edit</TreeListCommandButton>
                        }
                        if (item.IsRemovable)
                        {
                            <TreeListCommandButton Command="Delete" Icon="delete">Delete</TreeListCommandButton>
                        }
                    }

                    <TreeListCommandButton Command="Save" Icon="save" ShowInEdit="true">Update</TreeListCommandButton>
                    <TreeListCommandButton Command="Cancel" Icon="cancel" ShowInEdit="true">Cancel</TreeListCommandButton>
                </TreeListCommandColumn>
            </TreeListColumns>
        </TelerikTreeList>


        <div>
            @if (Disease.name != "")
            {
                <a class="btn btn-danger" @onclick="@DeleteDisease">
                    Delete
                </a>
            }
            <button type="submit" class="btn btn-primary edit-btn">Save disease</button>

            <a class="btn btn-outline-primary" @onclick="@NavigateToOverview">Back to overview</a>
        </div>


    </EditForm>

If I move the TreeList outside the EditForm everything works without a problem but I am reluctant to do so because it is a better code-structure to have all the components inside the EditForm.

Is there any way to avoid this exception?

with regards

Lucian

Hello,

I want to display a database table's content in a TelerikGrid object.

I am working with Linq and Entity Framework.

TelerikGrid's Data property is set with a Linq IQueryable object.

Why an IQueryable ? Because TelerikGrid manages paging, sorting and filtering. Working with an IQueryable object make possible the execution of a single SQL optimized query.

I have made a very basic loader (animation). I have a flag:

When this flag is set to true, the loader is displayed.

When the flag is set to false, the grid is displayed instead of the loader.

I don't know when set my flag to false. I am working with an IQueryable. So i don't know when the SQL query is finished. The execution of this SQL query is fired by the TelerikGrid. There are no events like "DataReady", or "DataLoadDone" in TelerikGrid. How can i do ?

Please note the embedded loader inside the TelerikGrid is not displayed for the first page. I can see it when i change TelerikGrid page.

Thanks

I have a page with a Tab Strip on it.  One of the Tabs has a form on it. The user wants to be able to access a tab but then be able to go to the Tab with a form and fill in part of it, go to another tab and then back to the form and fill in some more of the form and then submit the form.  Are there any examples of being able to switch between tabs while persisting the data in the form until it is submitted?  

Each of the tabs consists of a separate component.

Hi when I select an item I get a change event as expected, but I also got one on lostfocus, when I tab away.

  <td class="pe-3"><TelerikComboBox
            Data="@ComboItems"
            TextField="Name"
             ValueField="Id"
             @bind-Value="SelectedValue"
             OnChange="ValueChangedHandler"/></td>

private void ValueChangedHandler(object value)
        {
            int id = (int) value;
            Console.WriteLine("" + id);
        }

ValueChangedHandler called twice

Hi I would like to change the datasouce dynamic for a combobox.

I have two radiobuttons on top of the CB. The chosen radio button should change the datasource.

What are my options?

Two Comboboxes stacked? mange visibility base on the radio button value?

Hello,

First of all, please note i am doing tests with a Trial version of Telerik (2.25.0).
I plan to buy licence in a few days but i need to be sure Telerik is appropriated for my project.

I have an issue with websocket data volume on RadGrid.

Here is what i've done:

- I have create an empty Blazor Server project (.Net 5 dotnet framework)

- I have create an Entity with 2 properties: Id (Int32) and Name (String, 10 chars max)

- I have create a database with about 500 records of the previous Entity.

- I have put a RadGrid component with pagination (10 items per page). This Grid is displaying the 500 records. I have checked something on Entity Framework and SQL Server: RadGrid sends a new SQL request on each page change and only fetchs 10 items on each page.

- Telerik paging is very slow for me (my customers will run my application with a very poor connexion)

- I have sniffed packets on network and i have seen a very huge amount of data in websocket traffic when i click on another Radgrid page on my browser: 377ko per page (for only 10 items of { Int32, String[10] } !).

Here is what i've done: I have cleared my sniffer. Then i have changed page one time in my browser and i have stopped sniffer. Everything was done on a virtual machine. There were no other traffic (Internet or local)

In wireshark, i see a huge amount of data on the websocket stream.
Here is a very short extract:

!.......!.......!.......!...............................!.......!.......!.......!.......!.......!.......!.......!.......!.......!.......!.......!...............................!.......!.......!...... !......!!......"!......#!......$!......%!......&!......'!......(!..............................)!......*!......+!......,!......-!.......!....../!......0!......1!......2!......3!......4!..............................5!......6!......7!......8!......9!......:!......;!......<!......=!......>!......?!......@!..............................A!......B!......C!......D!......E!......F!......G!......H!......I!......J!......K!......L!..............................M!......N!......O!......P!......Q!......R!......S!......T!......U!......V!......W!......X!..............................Y!......Z!......[!......\!......]!......^!......_!......`!......a!......b!......c!......d!..............................e!......f!......g!......h!......i!......j!......k!......l!......m!......n!......o!......p!..............................q!......r!......s!......t!......u!......v!......w!......x!......y!......z!......

And on the bottom of the stream, i can see the datas displayed on my grid:

...

HelloWorld.gridcell.1.0.  .1.false.256.gridcell.1.1.  .2.false

...

This grid datas are packed and they are not heavy (about 2kbytes). But what are the 375k previous bytes ?
Is there a way to avoid them ?

Please not i am running this project in a Developpment environnement. Do you think the 375kbytes datas can be debug informations and if so, how can i remove them ? I can't run in Production mode, maybe due to trial version but i need to know before buying licence why websocket data is so heavy.

Thanks a lot.

Hello

According to the Telerik Blazor Combobox documentation, it is not possible to have e.g. decimal values when I want to use AllowCustom="true":

• AllowCustom - whether the user can enter custom values. If enabled, the ValueField must be a string.

In my application it would be great to have the option to allow custom values, but decimal only. I've seen this for e.g. NumericTextBox. There is a parameter "T" where one can define the type of the value. Here you can see an example code extracted from my application:

<TelerikComboBox Data="@Data"
                 @bind-Value="@SelectedValue"
                 TextField="Value"
                 ValueField="Value"
                 AllowCustom="true"
                 Placeholder="Select a value or set a custom value">
</TelerikComboBox>

public List<MyData> Data { get; set; }
public decimal SelectedValue { get; set; }

public class MyData
{
    public decimal Value { get; set; }
}

Hi

Is Focus is available for Telerik Button? 

Could you please suggest on this?

Thanks,

Vishnu Vardhanan H