search

jackrabbitsgroup / angular-multiselect

AngularJS LIGHTWEIGHT (no jQuery or dependencies!) Multi Select Input Directive
11 stars 2 forks source link

offsetTop is not supported in modern browsers? #1

Open markv12 opened 5 years ago

markv12 commented 5 years ago

I'm currently running in Firefox and when the directive loads I get "getFocusCoords prop offset null.." Which prints when !eles.displayBox.prop('offsetTop') || !eles.dropdown.prop('offsetTop')

When I select items from the dropdown, sometimes it selects the item properly and other times it closes the dropdown and nothing is added to the selection.

markv12 commented 5 years ago

Ok, I'm not actually sure what's going on. I replaced all the calls to things like offsetTop to their jQuery equivalents and the problem persists. Sometimes it selects an item correctly and adds it to the list, and sometimes it doesn't

markv12 commented 5 years ago

Ok, so ultimately that wasn't the problem, it was the timing issue you aluded to here:

//define timings for $timeout's, which must be precise to work properly (so events fire in the correct order)
//@todo - fix this so it works 100% of the time - sometimes the options dropdown will close 
var evtTimings ={
  'selectOptBlurReset':325,       //must be LONGER than onBlurDelay to keep options displayed after select one
  'clickInputBlurReset':225,
  'onBlurDelay':225       //this must be long enough to ensure the selectOpts click function fires BEFORE this (otherwise the options dropdown will close BEFORE the click event fires and the option will NOT be selected at all..
};

increasing the delay seems to fix the issue for the most part. If you have any ideas on how to fix this issue permanently, please let me know. Thanks for writing this super simple and easy to modify directive!