Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

On Removed never called #607

Closed
RobertoBiundo opened this issue Mar 1, 2017 · 10 comments
Closed

On Removed never called #607

RobertoBiundo opened this issue Mar 1, 2017 · 10 comments

Comments

@RobertoBiundo
Copy link

RobertoBiundo commented Mar 1, 2017

I have this

var options = {
                cellHeight: 200,
                width: 5,
                height: 4,
                verticalMargin: 4,
                float: true,
                removable: '.remove-area',
                removeTimeout: 100
            };
            $('.grid-stack').gridstack(options);

that initialises the grid the way i want it...fine...
I have an div with a class .remove-area
the drag and drop to remove procedure is working, if i drag a widget it gets removed, but...

if i do this (as described in the docs)

$('.grid-stack').on('removed', function(event, items) {
                console.log(items);
            });

this function never gets called.
Any ideas?

@kyleroberthammond
Copy link

Same problem here.

@kyleroberthammond
Copy link

kyleroberthammond commented Mar 28, 2017

You can bind a jquery remove event on the child elements.

e.g $(".grid-stack-item").on("remove",function(){
console.log(this)
})

something like that should do the trick. If you are referencing it to a object just assign a id on each element. Which you can do with the addWidget function (last param), and then use jquery's attr function to compare.

@MarkoIvanetic
Copy link

MarkoIvanetic commented Mar 29, 2017

I did a nasty workaround, tweaked onEndMoving() in the gridstack.js

 if (node._isAboutToRemove) {
                forceNotify = true;
                el.removeData('_gridstack_node');
                el.trigger('widget-removed') // My line
                el.remove();
            }

and then

        $('.grid-stack').on('widget-removed', '.grid-stack-item', function() {
            console.log($(this));
        });

That way it works on dynamic items

@RodgerLai
Copy link

@MarkoIvanetic It's working,thank you ~~~~,so that i can get the data-gs-id and do my operating

@RobertoBiundo
Copy link
Author

@MarkoIvanetic Nice solution, i allowed me to find the problem.
.remove() in jquery doesn't trigger the .on("remove") event. you have to explicitly call .trigger('remove')

You don't need to create a new trigger. you just need to use the existing one like this.

if (node._isAboutToRemove) { forceNotify = true; el.removeData('_gridstack_node'); el.trigger('remove').remove(); }

and then in your code do this
$('.grid-stack').on('remove', '.grid-stack-item', function() { console.log($(this)); });

This fixes the problem without adding a new trigger. I'm going to create a pull request for this and hopefully it will be included in the next version. The fact is that i want to use this trough a cdn and don't want to host the custom .js locally. But for now it will do.
Thank you for your help.

@RodgerLai
Copy link

@RobertoBiundo good job man. without creating new trigger.

@MarkoIvanetic
Copy link

Still now that it's modified i cant use it with bower.

@kyleroberthammond
Copy link

Thanks this is a better solution :).

@RobertoBiundo
Copy link
Author

Just to let you guys know that i already created a pull request and hopefully this will be included soon and @MarkoIvanetic can start using it with bower.
#622

@radiolips radiolips added this to the v0.3.0 milestone Apr 20, 2017
radiolips added a commit to radiolips/gridstack.js that referenced this issue Apr 21, 2017
@radiolips
Copy link
Member

Fixed in develop branch. Will go live in v0.3.0 later today.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

5 participants