Error in SfTreeGrid Drag and Drop

10 Replies
3 Participants

Created by
JL jose luis barajas

Platform
Blazor

Platform
Blazor

Control
TreeGrid

Created On
Apr 23, 2021 05:53 AM UTC

Last Activity On
Jul 1, 2022 05:09 AM UTC

Want to subscribe?
SIGN IN

After update to Blazor 19.1.0.57

Drag and drop in same Treegrid gives this error, please help!!!

blazor.server.js:1 Uncaught (in promise) Error: System.InvalidCastException: Unable to cast object of type 'System.Collections.Generic.List`1[System.Object]' to type 'System.Collections.Generic.List`1[System.Dynamic.ExpandoObject]'.

at Syncfusion.Blazor.TreeGrid.Internal.RowDD`1.ReorderRows(Int32 fromIndex, Int32 toIndex, String dropPosition, String action, Boolean isDragWithinGrid, String targetClass, String targetId, DotNetObjectReference`1 destInstance, Boolean outsideGrid)

at Syncfusion.Blazor.TreeGrid.Internal.GridRenderer`1.ReorderRows(Int32 fromIndex, Int32 toIndex, String action, Boolean isDragWithinGrid, String targetClass, String targetId, DotNetObjectReference`1 destInstance, Boolean outsideGrid, String dropPosition)

at Object.endInvokeDotNetFromJS (blazor.server.js:1)

at e.<anonymous> (blazor.server.js:10)

at blazor.server.js:1

at Array.forEach (<anonymous>)

at e.invokeClientMethod (blazor.server.js:1)

at e.processIncomingData (blazor.server.js:1)

at e.connection.onreceive (blazor.server.js:1)

at WebSocket.i.onmessage (blazor.server.js:1)

My code is as follows:

....

SfTreeGrid<QueryWorkModel> treeGrid;

public List<QueryWorkModel> treeData = new List<QueryWorkModel>();

<SfTreeGrid @ref="treeGrid"

ID="Grid"

DataSource="@treeData"

IdMapping="WORK_ID"

ParentIdMapping="PARENT_ID"

RowHeight="30"

Height="80%"

TreeColumnIndex="2"

AllowPaging="true"

AllowRowDragAndDrop="true">

<TreeGridPageSettings

PageSize="200"

PageSizeMode="PageSizeMode.All">

</TreeGridPageSettings>

<TreeGridSelectionSettings

Type="Syncfusion.Blazor.Grids.SelectionType.Single">

</TreeGridSelectionSettings>

<TreeGridEvents

OnRowDragStart="@OnRowDragStart"

RowDropped="@OnRowDropped"

RowDataBound="@OnRowDataBound"

TValue="QueryWorkModel">

</TreeGridEvents>

...

and methods declaration, before upgrade runs fine....

private void OnRowDragStart(Syncfusion.Blazor.Grids.RowDragEventArgs<QueryWorkModel> args)

{

}

private async Task OnRowDropped(Syncfusion.Blazor.Grids.RowDragEventArgs<QueryWorkModel> args)

{

}

10 Replies

JL jose luis barajas April 23, 2021 06:14 AM UTC

Testing in WASM Blazor project version 19.1.0.56

gives similar error

blazor.webassembly.js:1 Uncaught (in promise) Error: System.InvalidCastException: Specified cast is not valid.

at Syncfusion.Blazor.TreeGrid.Internal.RowDD`1.<ReorderRows>d__17[[WEBAPI.Shared.DepartamentoModel, WEBAPI.Shared, Version=1.0.0.0, Culture=neutral, PublicKeyToken=null]].MoveNext()

at Syncfusion.Blazor.TreeGrid.Internal.GridRenderer`1.<ReorderRows>d__82[[WEBAPI.Shared.DepartamentoModel, WEBAPI.Shared, Version=1.0.0.0, Culture=neutral, PublicKeyToken=null]].MoveNext()

at Object.endInvokeDotNetFromJS (blazor.webassembly.js:1)

at Object.invokeJSFromDotNet (blazor.webassembly.js:1)

at Object.w [as invokeJSFromDotNet] (blazor.webassembly.js:1)

at _mono_wasm_invoke_js_blazor (dotnet.5.0.5.js:1)

at do_icall (<anonymous>:wasm-function[10596]:0x194e4e)

at do_icall_wrapper (<anonymous>:wasm-function[3305]:0x79df9)

at interp_exec_method (<anonymous>:wasm-function[2155]:0x44ad3)

at interp_runtime_invoke (<anonymous>:wasm-function[7862]:0x12efff)

at mono_jit_runtime_invoke (<anonymous>:wasm-function[7347]:0x118e5f)

at do_runtime_invoke (<anonymous>:wasm-function[3304]:0x79d42)

PK Padmavathy Kamalanathan Syncfusion Team April 26, 2021 10:58 AM UTC

Hi Jose,

Thanks for contacting Syncfusion Forums.

Query: Error in SfTreeGrid Drag and Drop

We can reproduce the reported issue at our end. We have considered it as a bug and logged report for the same. Thank you for taking time to report this issue Script error while performing Row Drag and Drop with PageSize mode as "All" and helping us improve our product. Fix for this issue will be included in our upcoming bi-weekly release which is expected to be rolled out on or before 5^th May 2021.

You can track the status of your request, review the proposed resolution timeline, and contact us for any further queries through this link,

Feedback link: https://www.syncfusion.com/feedback/24689/script-error-while-performing-row-drag-and-drop-with-pagesize-mode-as-all

Note: To view the above feedback, kindly login into your account.

Kindly get back to us for further assistance.

Regards,

Padmavathy Kamalanathan

JL jose luis barajas May 6, 2021 06:22 PM UTC

Hi Padmavathy

Thanks for your support

Its working fine now!

PK Padmavathy Kamalanathan Syncfusion Team May 7, 2021 07:03 AM UTC

Hi Jose,

Thanks for your update. Kindly get back to us for further assistance.

Regards,

Padmavathy Kamalanathan

JL jose luis barajas June 28, 2022 10:04 PM UTC

Today I have error with Blazor Drag and Drop

RowDropped not fired!, please help

My end: Blazor WASM with Syncfusion 20.1.0.61

Long time ago this was working fine without making any changes.

   <SfTreeGrid @ref="tree2"
                DataSource="@dataSource"
                IdMapping="DEPARTAMENTO_ID"
                EnableVirtualization="false"
                AllowPaging="true"
                ParentIdMapping="PADRE_ID"
                AllowExcelExport="true"
                Width="auto"
                Height="@Height"
                RowHeight="20"
                TreeColumnIndex="1"
                AllowRowDragAndDrop="true">
        <TreeGridPageSettings PageSize="30" PageSizeMode="PageSizeMode.All"></TreeGridPageSettings>
        <TreeGridSelectionSettings Type="Syncfusion.Blazor.Grids.SelectionType.Single"></TreeGridSelectionSettings>
        <TreeGridEvents
            OnRowDragStart="OnRowDragStart"
            RowDropped="@OnCambiarParent"
            TValue="DepartamentoModel"
            DataBound="OnRowDataBound">
        </TreeGridEvents>
        <TreeGridColumns>
            <TreeGridColumn HeaderText="Acción" Width="130"/>
            <TreeGridColumn Field="DEPARTAMENTO_ID" HeaderText="Id" Width="100px" TextAlign="Syncfusion.Blazor.Grids.TextAlign.Left"
                            HideAtMedia="(min-width: 800px)"/>
            <TreeGridColumn Field="NOMBRE" HeaderText="Departamento" Width="100%"/>
        </TreeGridColumns>
    </SfTreeGrid>

FS Farveen Sulthana Thameeztheen Basha Syncfusion Team June 29, 2022 02:04 PM UTC

Hi Jose,

Query#:- RowDropped not fired!, please help

From your provided code example, we found that you have not enabled IsPrimaryKey property which is necessary for performing RowDragandDrop operations(which is the cause of the reported problem).

https://www.syncfusion.com/downloads/support/directtrac/general/ze/Tree_(2)-2031449771.zip

After enabling isPrimaryKey property still faced issue in this version 20.1.61, share us the following details.

Complete TreeGrid code example.
Screenshot/Video Demo to replicate the issue.
If possible replicate it in the above sample and revert us back.

Regards,

Farveen sulthana T

JL jose luis barajas June 29, 2022 03:15 PM UTC

Hi Farveen sulthana T

I just tried the example you sent me and error persists.

I send you a video to show what happens.

Rows change places up or down, but not create nesting.

Also method OnCambiarParent is not fired! IMPORTANT!!!

I simplify code

<SfTreeGrid @ref="tree2"

DataSource="@TreeGridData"

IdMapping="DEPARTAMENTO_ID"

AllowPaging="true"

ParentIdMapping="PADRE_ID"

Width="auto"

Height="300"

RowHeight="20"

TreeColumnIndex="0"

AllowRowDragAndDrop="true">

<TreeGridEvents

OnRowDragStart="OnRowDragStart"

RowDropped="OnCambiarParent"

TValue="WrapData" >

</TreeGridEvents>

</TreeGridColumns>

</SfTreeGrid>

Code behind its the same.

Please help

Attachment: bandicam_20220629_100713705_46b6fbe3.rar

FS Farveen Sulthana Thameeztheen Basha Syncfusion Team June 30, 2022 02:43 PM UTC

Hi Jose,

We have checked your reported problem in the attached sample but we are unable to replicate the issue at our end. Refer to the Video Demo attached:-

https://www.syncfusion.com/downloads/support/directtrac/general/ze/Video-1865377545.zip

We suspect that the reported problem may occurs when there is conflict in CSS changes because the border line on performing Draganddrop is not shown in your application. So please ensure that you have referred the CSS with version as like we have provided in our index.html page.

If you are upgrading into latest version from 19.4, we request to follow the breaking Changes that we have implemented. Refer to the documentation link:-

https://blazor.syncfusion.com/documentation/release-notes/20.1.47?type=all#breaking-changes

If already followed, kindly Ignore. So please ensure the steps suggested and after following this still faced issue, Share us the following details.

Have you applied any external CSS changes to TreeGrid. If yes please share us the details.
Are you facing the same issue on running the Sample directly or implementing the code snippets in your application.
If you are facing the issue only on your application, if possible share us the simple issue replicable sample.

Regards,

Farveen sulthana T

JL jose luis barajas June 30, 2022 03:21 PM UTC

Hi Farveen

I just checked your comments about css. I forgot to update these lines in index.html

Now its working fine,

thanks for your support!

FS Farveen Sulthana Thameeztheen Basha Syncfusion Team July 1, 2022 05:09 AM UTC

Hi Jose,

You're most welcome. Please get back to us if you need any further assistance. We are happy to assist you.

Regards,

Farveen sulthana T

Need More Help?

Get personalized assistance from our support team.

Contact Support

10 Replies
3 Participants
Want to subscribe?
SIGN IN
Created by
JL jose luis barajas
Platform
Blazor
Control
TreeGrid
Created On
Apr 23, 2021 05:53 AM UTC
Last Activity On
Jul 1, 2022 05:09 AM UTC

Need More Help?

Get personalized assistance from our support team.

Contact Support