Clever Geek Handbook

How do I leave text selectable for a draggable element in Angular 2 Dragula?

I'm using dragula in an angular 2 app, and I'm wondering if there is a way to leave the text selectable so that the scrolls inside the dragged element should still behave by default, so you can highlight the text on it. As far as I can tell, it looks like this is not an option for dragula variants. Maybe someone knows an easy way?

+3


source to share


1 answer


So I think I found a solution that I am ok with. I changed the move parameter in the dragula service to be like this

moves(element, container, handle) {
                return element.nodeName === 'my-draggable-element' && handle.nodeName !== 'span'
            }

so when we try to drag our element to the place where the range is, we won't be able to do it.



And then in the css I just added this code:

my-draggable-element {
    span {
        -moz-user-select: text;
        -khtml-user-select: text;
        -webkit-user-select: text;
        cursor: text;
    }
}

so now the text can be selected and the element is still dragged if we hold it on the non-text parts.

+1


source






More articles:


All Articles