Slider not set position on load inside Bootstrap modal
karanvirrkumar opened this issue · 3 comments
I have tried many ways earlier of issues that were closed.
My slider psoition is not set on load if it is inisde bootstrap modal. It works if I click on it or resize my screen
I have added a plunkr for a demo. Please check it out and help me out..
As explained in other issues and on the "Sliders inside a modal" demo (https://angular-slider.github.io/angularjs-slider/), you need to call $rootScope.$broadcast('rzSliderForceRender');
when the accordion is opening.
I have added `** $rootScope.$broadcast('rzSliderForceRender');** into function and called it on all 3 accordian collapsed divs, it worked but not fully.
please follow the steps as below to find issue:-
-
open first div - it wont work
it will make everything fine for 2nd and 3rd div. -
click on 2nd div - it will work fine
-
click on 3rd div - it will work fine but it will ruin everything for 2nd div.
-
now click on 2nd div (everything ruined).
check this new plunkr after adding $rootscope
https://embed.plnkr.co/HAjNMOnw5ahGDGzMDKcZ/
@officialkansal HI, I know that maybe this is not a good way of handle this but I hope that help because it helped me, I found it accidentallty :-D
call a window resize event with a 500ms or less timeout after on opening the modal and it will work.
setTimeout(() => { window.dispatchEvent(new Event('resize')); // $(window).trigger('resize'); }, 500);