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

fix ac container positionning #59

Open
wants to merge 1 commit into
base: master
Choose a base branch
from

Conversation

bobbybobby
Copy link

Hi,
I have an issue with the positionning of the AC container when the massautocomplete field is inside a positionned block, of fixed height with overflow: scroll.

That is because in _position_autocomplete(), the scroll of the body element is taken into account, but not the scroll of said container. I put an example of my problem in this plunker :
https://plnkr.co/edit/6pRPNSM8ulKPsuTLYEA9?p=preview

My idea is to force the AC container to be positionned in reference to the

block. So the position_autocomplete() function would simply be :

config.position_autocomplete = function(container, target) {
  var rect = target[0].getBoundingClientRect();

  container[0].style.left = 0;
  container[0].style.top = rect.height + 'px';
  container[0].style.width = rect.width + 'px';
};

And we need to make sure that

is a positionned element, with something like that :

  if (['fixed', 'absolute', 'sticky', 'relative'].indexOf($element.css('position')) === -1) {
    $element.css('position', 'relative');
  }

@hakib
Copy link
Owner

hakib commented Oct 8, 2016

Hey @bobbybobby,

The position auto_complete function was moved to a provider for this purpose - so it can be customized by the consumer.

You can override the function in you project by injecting the provider to the app config:

angular.module('myApp', [''])

.config(massAutocompleteConfigProvider, function() { 

    massAutocompleteConfigProvider.position_autocomplete = function(container, target) { 
        // ... Your implementation
    }
})

Is this something that can solve your issue in this case?

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

Successfully merging this pull request may close these issues.

2 participants