search

mattlewis92 / angular-bootstrap-calendar

A port of the bootstrap calendar widget to AngularJS (no jQuery required!)
https://mattlewis92.github.io/angular-bootstrap-calendar/
MIT License
798 stars 369 forks source link

External event in scroll div-disappear #599

Closed zigkasg closed 7 years ago

zigkasg commented 7 years ago

Hi,

I need your help. I have a div with horizontal scoll bar where I have my external events. When I am dragging the event out of the scrolling div is disappearing.

Could you please suggest some tricks to avoid this issue?

Thanks for your help. George

burtek commented 7 years ago

Could you please provide plunker with this issue? We are not able to help without that.

zigkasg commented 7 years ago

Hi Burtek, Thanks for your answer. Try this http://plnkr.co/edit/MrYxPNWbVM2riqltZnHv?p=preview

As you can see, once you drag the event outside the div, the button(event) is going behind the calendar. How can I fix this?

Thanks George

burtek commented 7 years ago

Well, it's not the button that goes behind the calendar, it's overflow: scroll which hides elements that get outside of parent's border (compare overflow: scroll and overflow: visible explanations here). overflow: visible would make the buttons visible when outside of parent element, but you cannot force the scrollbar to appear with this.

The only solution that comes to my mind would be to have a helper function, that would clone the draggable to another div with overflow: visible when dragging (just as in jQuery). Also, check this topic on forum of another js library, that describes the same problem.

zigkasg commented 7 years ago

Hi Burtek, Thanks for your answer. However, I will need some more steps on how to do this on angular witht this module if you can. I tried to use mwl-drag-select in order to triger the clone function but it seems that is not the right direction.

Can you suggest anything else on how to trigger the function once the button will be dragged?

Thanks

burtek commented 7 years ago

Actually I've had no luck with this, either. I looked at MwlDraggableCtrl and it looks like we'd have to change how interactjs is invoked there by adding the helper clone function, and then rebuild this lib with that change... Maybe @mattlewis92 would have another idea.

mattlewis92 commented 7 years ago

Sorry about the late reply on this one, you can workaround it by setting the event position to fixed when dragging the event to remove it from the document flow / scroll container: http://plnkr.co/edit/hzaga07OTtC8SAD2qAeC?p=preview Hope that helps! 😄