We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: June 24, 2019).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Pivot Table Grouping Bar - Rows & Columns drag & drop handler

Thread ID:

Created:

Updated:

Platform:

Replies:

146432 Aug 3,2019 06:38 AM UTC Aug 6,2019 08:48 AM UTC React - EJ 2 3
loading
Tags: PivotView
Jonathan Rim
Asked On August 3, 2019 06:38 AM UTC

Hi,

For the React Pivot Table's Grouping Bar feature,

Is there a way to handle the drag & drop behavior when moving around fields between rows/columns/filters?

I want to prevent this default behavior of filtering since it's a bit slow, and use my own queries to my server instead.

Thank you!

Thirupathi Bala Krishnan [Syncfusion]
Replied On August 5, 2019 12:34 PM UTC

Hi Jonathan, 
Thanks for contacting Syncfusion support. Please find the response below. 

Query 
Response 
Is there a way to handle the drag & drop behavior when moving around fields between rows/columns/filters? 
You can enable/disable drag and drop feature through the property allowDragAndDrop”. Please find the following code snippet for your reference. 

Code snippet: [React] 
  this.groupingSettings = { 
     allowDragAndDrop: false 
   }; 

I want to prevent this default behavior of filtering since it's a bit slow, and use my own queries to my server instead. 

You cannot change the default behavior of filtering. But, you can hide the filter icons in the UI through the property “showFilterIcon” to false. 

Code snippet: [React] 
  this.groupingSettings = { 
     showFilterIcon: false 
   }; 



Please let us know if you have any concerns. 

Regards, 
Scintilla A 


Jonathan Rim
Replied On August 5, 2019 02:22 PM UTC

Hi Scintilla,

Thank you for the neat and detailed response!

Is there a function that does the drag handling? For example, onDragEnd that contains which element in the rows array is being dragged into the columns array, and on returning the results, moves the element between the arrays? I'd like to not let this action go through, and instead make a query from Mongo to update the table.

Thirupathi Bala Krishnan [Syncfusion]
Replied On August 6, 2019 08:48 AM UTC

Hi Jonathan, 

Thanks for the update. Please find the response below. 

We have checked your query and you can get the details of elements which are being dragged using “onFieldDropped” event. Please find the code snippets for your reference. 
 
Code snippet:[React] 
<PivotViewComponent id='PivotView' ref={(scope) => { this.pivotObj = scope; }} onFieldDropped= {this.trend.bind(this)}> 
</PivotViewComponent> 
 
trend(args) { 
    console.log(args); // Paste your code here 
} 
 
Screenshot: 
 
 
Please let us know if you have any concerns. 

Regards, 
Scintilla A 


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile
Live Chat Icon