Dynamically changing drag handle class

[ofples]

Hi, I'm using the angular-gridster library for a project and It's been great except for one little thing. I need to change the class of the drag handle dynamically (switch between two classes) but it seems that after switching the class, I have to resize, or at least click on the resize handles of a widget in order for the drag handle class change to take effect. Any ideas? Thanks! :)

[J-Zeitler]

The gridster directive has a refresh(config) that reloads the config and gets called when resizing: https://github.com/ManifestWebDesign/angular-gridster/blob/master/src/angular-gridster.js#L638

As for your issue, I have the same one. A hacky solution would be to expose the refresh() through GridsterCtrl and call that when you need to refresh.

... but that requires a rewrite of this module

Edit: wait a moment, it does already expose that: https://github.com/ManifestWebDesign/angular-gridster/blob/master/src/angular-gridster.js#L107

will try it out

Edit: nope, simply setting the options does not work, the gridster directive only watches the options attribute for changes... https://github.com/ManifestWebDesign/angular-gridster/blob/master/src/angular-gridster.js#L693

[iradovanovic]

HI. I have a similar problem. I just dynamically create element into the grid. And when I want to move it, is not possible until I resize the element. This problem appears after update to Angular 1.4 and only if I use option for a gridstar "handle". If I don't specify dragging area (handle) then is working. Any suggestion?

[ofples]

@J-Zeitler Thanks for the comment. I did try that and it doesn't work. @iradovanovic I'm also create the grid item dynamically, so it must have something to do with that. Will update if I find anything.

[iradovanovic]

Any update ? Hack-fix? :)

[arthurmagne]

@iradovanovic I had the same issue. I solved it by setting the draggable.enabled option in the gridster options to false at the beginning. I then set it to true when i'm sure that all my gridster elements are loaded (in a $timeout)

It works well in my case :)

[pedro-mass]

@arthurmagne -> it works!

I start off with draggable.enabled set to false. Since I'm allowing them to dynamically add/remove gridster elements, I added an ngInit in the template to set that field to true.

something similar was suggested on another issue.

328

[pedro-mass]

I have to take that back. It worked on the initial page load, but when another gridster item is added dynamically, it doesn't respect the draggable handle.

[michalmw]

@J-Zeitler How you use .refresh()?

I try use this but not working. I try create button for change draggable.enabled status, and use .reflesh(). But i don't know how..