search

shlomiassaf / ngrid

A angular grid for the enterprise
https://shlomiassaf.github.io/ngrid
MIT License
241 stars 40 forks source link

rowReorder and columnReorder feature not working anymore after angular 11 upgrade #147

Closed mldkishore closed 3 years ago

mldkishore commented 3 years ago

What is the expected behavior?

Row reorder and column reorder should work

What is the current behavior?

While dragging the row for reordering gives "Cannot read property 'wontBudge' of undefined" error in console and not able to drag the row for reordering. Column reordering doesn't show any sign of dragging nature. Getting console error "Cannot read property 'grid' of undefined" on the page load itself

What are the steps to reproduce?

Providing a StackBlitz reproduction is the best way to share your issue.
StackBlitz starter: stackblitz.com/edit/pebula-ngrid-starter

Just run the demo application provided by ngrid team, and run the application and try dragging the rows and columns Note(tried enabling both ivy and disabling ivy, both dint helped).

Which versions of Angular, CDK, Material, NGrid, OS, TypeScript, browsers are affected?

image

Is there anything else we should know?

shlomiassaf commented 3 years ago

This is already fixed in the demo and will get fixed in the next release

It will now also work with virtual scroll

Sent from my iPhone

On 20 Dec 2020, at 17:41, mldkishore notifications@github.com wrote:

 What is the expected behavior?

Row reorder and column reorder should work

What is the current behavior?

While dragging the row for reordering gives "Cannot read property 'wontBudge' of undefined" error in console and not able to drag the row for reordering. Column reordering doesn't show any sign of dragging nature. Getting console error "Cannot read property 'grid' of undefined" on the page load itself

What are the steps to reproduce?

Providing a StackBlitz reproduction is the best way to share your issue.

StackBlitz starter: stackblitz.com/edit/pebula-ngrid-starter

Just run the demo application provided by ngrid team, and run the application and try dragging the rows and columns Note(tried enabling both ivy and disabling ivy, both dint helped).

Which versions of Angular, CDK, Material, NGrid, OS, TypeScript, browsers are affected?

Is there anything else we should know?

— You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub, or unsubscribe.

mldkishore commented 3 years ago

@shlomiassaf https://stackblitz.com/edit/pebula-ngrid-starter - is this the link do you refer as 'fixed in demo' ?? because I just run that code in my machine and couldn't see the reordering work. " will get fixed in the next release" - when can we expect this. please clarify

shlomiassaf commented 3 years ago

This is the demo

https://shlomiassaf.github.io/ngrid/

Stackblitz won't work because it's not released

I will try to release another alpha in the next couple of days.

mldkishore commented 3 years ago

@shlomiassaf Got it. Thanks for the updates. will wait for the release then.

shlomiassaf commented 3 years ago

Version 3.0.0-alpha.4 now released with the working code for row reordering

mldkishore commented 3 years ago

@shlomiassaf row reordering works now. any thoughts on columnReorder feature. still it is broken.

shlomiassaf commented 3 years ago

As far as I know, the column reorder feature works well.

@mldkishore when you say broken, where?

StackBlitz has issues with IVY, it only runs on ViewEngine so it will not work.

There's also a demo in Code Sandbox but here it's the same, once you add the columnReorder plugin it get's into a loop.

My guess is that their implementation for IVY is half baked and they don't support all scenarios. Once they will provide full support for IVY it will work.

I can't account to these platform, I don't have the resources...

It does work in the starter demo here Source Code

As a side note, the DRAG features does not work well with ViewEngine compilation because the implementation in nGrid is using class inheritance ("extend") to extend the capabilities in the core CDK drag directives and make them work for nGrid.
ViewEngine does not handle this well and so it doesn't work as expected, you need IVY compilation for that.

Since we're in angular 11, and 12 will remove all support for ViewEngine I don't see the need (and don't have the resources to) support ViewEngine for the drag plugin. This is a lot of work and requires complex code that simulate inheritance. It makes the drag plugin hard to understand and buggy. This was the case in version 2 and in version 3 I moved to inheritance and the code is now much simpler.

The complexity is great as it is, a lot of workaround are in place to support scenarios that the CDK drag does not support. For example, drag & drop of rows with virtual scrolling, not supported and I had to work around that. Ton's of other stuff I don't remember now :)

Hope it's clear