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

fires events with Select/Option with IE #114

Open
basilfarraj opened this issue May 1, 2016 · 4 comments
Open

fires events with Select/Option with IE #114

basilfarraj opened this issue May 1, 2016 · 4 comments

Comments

@basilfarraj
Copy link

in IE once i trigger the change event on the Select and enter the Options, the ouibounce fires.
i tried finding a fix couldn't get it done.
anyone has an idea how to fix this?

@kazimzaidi
Copy link

kazimzaidi commented Jul 8, 2016

I'm experiencing same. Any thoughts anyone? IE11.0

@basilfarraj
Copy link
Author

No one helped with this kazimzaidi.
I just disabled the the bounce when on IE.

@snietert
Copy link

snietert commented Oct 9, 2016

I was dealing with the same problem and also tried to fix this. Failed. As I had some time constraints there was either an option to remove ouibounce, disable it for IE or find some hack to make it work for everybody. I chose the hack way by just instantly hiding the popup and re-initializing it. It has to be fast enough so the user does not see it. Have to test cross browser. Not super nice but works :)

$('#selectTriggeringTheModal').on('mouseleave', function(e){ window.setTimeout(function() { $('.modal').hide(); $('.popup-bg').hide(); setUpModal(); }, 5); });

@yamanwa
Copy link

yamanwa commented Apr 4, 2017

Another workaround, check if the event was fired from within a select, this can be done on mouse event

var isIE = (navigator.appName == 'Microsoft Internet Explorer') || (navigator.appName == 'Netscape' && (new RegExp("Trident/.*rv:([0-9]{1,}[\.0-9]{0,})").exec(navigator.userAgent) != null));
if (isIE > 0) { /* IE */
	var list = document.getElementsByTagName("select");
	for (var i = 0; i < list.length; i++) {
		var rect = list[i].getBoundingClientRect();
		if (e.clientX >= rect.left && e.clientX <= rect.right && e.clientY >= rect.top && e.clientY <= rect.bottom) {
			return; /* event fired inside select */
		}
	}
	//Event in IE, not in a select
}
else {
	//Other browsers
}

Hope this is useful

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

No branches or pull requests

4 participants