hmonadjem
commented
9 years ago having the same effect ... in my case its even not in an table :/
Open felipegr opened 9 years ago
hmonadjem
commented
9 years ago having the same effect ... in my case its even not in an table :/
felipegr
commented
9 years ago @hmonadjem If it helps you, I managed to add some code to the directive that "corrects" this behavior. I don't believe it's a proper correction, but anyway, it works. I saw there was a difference between the two dropdowns created, the one which worked had the classes ".btn-group.bootstrap-select.ng-pristine.ng-untouched.ng-valid" in it and the duplicate hadn't, so what I did was to remove the wrong one.
Here's the code, I hope it is useful for you:
// Added $timeout
angular.module('angular-bootstrap-select', [])
.directive('selectpicker', ['$parse', '$timeout', function ($parse, $timeout) {
return {
restrict: 'A',
require: '?ngModel',
priority: 10,
compile: function (tElement, tAttrs, transclude) {
tElement.selectpicker($parse(tAttrs.selectpicker)());
tElement.selectpicker('refresh');
return function (scope, element, attrs, ngModel) {
if (!ngModel) return;
scope.$watch(attrs.ngModel, function (newVal, oldVal) {
scope.$evalAsync(function () {
if (!attrs.ngOptions || /track by/.test(attrs.ngOptions)) element.val(newVal);
element.selectpicker('refresh');
});
});
ngModel.$render = function () {
scope.$evalAsync(function () {
element.selectpicker('refresh');
});
}
// New code, removes the divs that don't have all the necessary classes
$timeout(function () {
if ($( 'div' ).find('.btn-group.bootstrap-select.ng-pristine.ng-untouched.ng-valid').length > 0 ) {
$('.bootstrap-select:not(.ng-pristine.ng-untouched.ng-valid)').remove();
}
});
};
}
};
}]);Hi, thank you, i figured out that it happens when the selectpicker is in an ng-if ...
Am Montag, 21. September 2015 schrieb felipegr :
@hmonadjem https://github.com/hmonadjem If it helps you, I managed to add some code to the directive that "corrects" this behavior. I don't believe it's a proper correction, but anyway, it works. I saw there was a difference between the two dropdowns created, the one which worked had the classes ".btn-group.bootstrap-select.ng-pristine.ng-untouched.ng-valid" in it and the duplicate hadn't, so what I did was to remove the wrong one.
Here's the code, I hope it is useful for you:
// Added $timeout angular.module('angular-bootstrap-select', []) .directive('selectpicker', ['$parse', '$timeout', function ($parse, $timeout) { return { restrict: 'A', require: '?ngModel', priority: 10, compile: function (tElement, tAttrs, transclude) { tElement.selectpicker($parse(tAttrs.selectpicker)()); tElement.selectpicker('refresh'); return function (scope, element, attrs, ngModel) { if (!ngModel) return;
scope.$watch(attrs.ngModel, function (newVal, oldVal) { scope.$evalAsync(function () { if (!attrs.ngOptions || /track by/.test(attrs.ngOptions)) element.val(newVal); element.selectpicker('refresh'); }); }); ngModel.$render = function () { scope.$evalAsync(function () { element.selectpicker('refresh'); }); } // New code, removes the divs that don't have all the necessary classes $timeout(function () { if ($( 'div' ).find('.btn-group.bootstrap-select.ng-pristine.ng-untouched.ng-valid').length > 0 ) { $('.bootstrap-select:not(.ng-pristine.ng-untouched.ng-valid)').remove(); } }); }; } };}]);
— Reply to this email directly or view it on GitHub https://github.com/joaoneto/angular-bootstrap-select/issues/49#issuecomment-141954884 .
von mobil gesendet
fthiemonge
commented
9 years ago We are having the same issue, but only with the minified js.
zdolin
commented
9 years ago +1
StefanOrzu
commented
8 years ago @hmonadjem is right. It happened to me when the select was nested inside an ng-if or ng-switch-when. I worked around it by placing the conditional directly on the select. It's not a nice solution, but at least it got the job done. A real fix is still necessary for this bug.
KevinHoward
commented
8 years ago https://github.com/joaoneto/angular-bootstrap-select/pull/57 <-- Here is the real fix. Thanks @xixao!
ghost
commented
8 years ago hey any one know how to give select filter in ng-table column i saw the doc but i cant understand any one have complete code
Hi,
I'm having an issue when trying to use a selectpicker inside a column of a ng-table, the dropdown is being duplicated and I can't find the reason.
Just as an example, I created the following table:
In the third column I created only one selectpicker with fixed options, but when the page is rendered there are 2 dropdowns, instead of one:
And only the upper one works, which means that the user can select an option, the other one shows the options and even let the user choose one of them, but doesn't change the selected option text. If I put the same
<select>tag outside the table it works ok.Here's the HTML code of the selectpickers after the page is fully rendered:
Can someone please help?
Thanks!