Prevent Drag Selection from input in Columns Template

Hey,


I have an Tree grid with these settings:

    <SfTreeGrid DataSource="@GridItems" IdMapping="Id" ParentIdMapping="ParentId" TreeColumnIndex="0" AllowRowDragAndDrop="true" AllowSelection="true">

        <TreeGridSelectionSettings Type="Syncfusion.Blazor.Grids.SelectionType.Multiple" Mode="Syncfusion.Blazor.Grids.SelectionMode.Row" AllowDragSelection="false"></TreeGridSelectionSettings>

and one of my columns have these definition:

 <TreeGridColumn Field="Price" HeaderText="Preis">

     <Template>


         @{

             if (context is TreeGridPositionWrapper item)

             {

                 if (item.BasePosition is MDetailPosition p)

                 {

                     <div @onclick:preventDefault="true" @onclick:stopPropagation="true"

                          @ondblclick:preventDefault="true" @ondblclick:stopPropagation="true"

                          @onmousedown:preventDefault="true" @onmousedown:stopPropagation="true"

                          @onmouseup:preventDefault="true" @onmouseup:stopPropagation="true"

                          @onmousemove:preventDefault="true" @onmousemove:stopPropagation="true"

                          @onpointerdown:preventDefault="true" @onpointerdown:stopPropagation="true"

                          @onpointerup:preventDefault="true" @onpointerup:stopPropagation="true"

                          @onpointermove:preventDefault="true" @onpointermove:stopPropagation="true"

                          @ontouchstart:preventDefault="true" @ontouchstart:stopPropagation="true"

                          @ontouchend:preventDefault="true" @ontouchend:stopPropagation="true"

                          @ondragstart:preventDefault="true" @ondragstart:stopPropagation="true"

                          @ondrag:preventDefault="true" @ondrag:stopPropagation="true"

                          @ondragend:preventDefault="true" @ondragend:stopPropagation="true">

                         <SfNumericTextBox TValue="decimal" ShowSpinButton="false" Format="C2"

                                           @onclick:stopPropagation="true"

                                           @ondblclick:stopPropagation="true"

                                           @onmousedown:stopPropagation="true"

                                           @onmousemove:stopPropagation="true"

                                           @onmouseup:stopPropagation="true"

                                           @onpointerdown:stopPropagation="true"

                                           @onpointerup:stopPropagation="true"

                                           @onpointermove:stopPropagation="true"

                                           @ontouchstart:stopPropagation="true"

                                           @ontouchend:stopPropagation="true"

                                           @ondragstart:stopPropagation="true"

                                           @ondrag:stopPropagation="true"

                                           @ondragend:stopPropagation="true"></SfNumericTextBox>

                     </div>

                 }

             }

         }

     </Template>

 </TreeGridColumn>


But if I drag the mouse inside the NumericTextBox to select the some Chars the grid starts drag selection.

How ca I prevent this?

As you can see, I tried to stop the propagation of many events, but this is not working.


Best wishes

Alex


3 Replies

SK Sreedhar Kumar Panarapu Sreenivasulu Panarapu Syncfusion Team April 14, 2025 10:29 AM UTC

Hi Alexander Kuhlmann,

We’ve reviewed your query regarding stopping the drag selection in the TreeGrid. It appears that the functionality you’re trying to achieve is not working as expected when attempting to prevent drag selection.

We suggest checking the solution provided in the forum for your issue. The solution for preventing drag selection was shared in the following forum thread: Forum Assist: Preventing Drag Selection.

Please try the suggested approach and let us know if you continue facing issues. If the problem persists after following the solution from the forum, feel free to reach out to us again, and we’ll assist you further.

Best regards,

Sreedhar Kumar.



AK Alexander Kuhlmann April 14, 2025 04:54 PM UTC

Hi Sreddhar, 


before I tried the way I described here, I tried the solution from the other thread, without success.

But now I found a solution, I had to fix various things in the js scripts and now it is working.


Thank you.




SS Shereen Shajahan Syncfusion Team April 15, 2025 04:20 AM UTC

Hi Alexander,

Glad to know that you have found a solution. Please get back to us for assistance in the future.

Regards,

Shereen


Loader.
Up arrow icon