Vertical scroll-bar of extjs4-multiselect is not displaying? - extjs

I'm using extjs 4.0.7 library. I have created UI as follows.
Landing page is a panel with border-layout.its north region have a panel with id: 'filterPanel'. This panel have a 'multiselect' component. Center region of landing page a tab panel, each panel having a grid.
Landing page has a listener, afterrender, on this listener I made filterPanel as collapsed by using Ext.getCmp('filterPanel').collapse().
The issue is, system not showing vertical scroll-bar when I expand 'filterPanel'.
If I remove panel collapse code from listener, scroll-bar is displaying.
Our requirement is filterPanel should be collapsed while rendering the UI, that's why I tried to collapse filter panel on landing-page afterrender listener.
Is this approach correct?
Regards,
Ajil

I got a work around for this issue. The steps which i followed is given below,
Add an expand listener for the panel here its 'filterPanel'
Remove all element from multiselect component store.
Reload multiselect store.
I'm sure its not a good fix , but time being its work for me.
Thank you all.

Related

Rendering of MUI TextField causes unwanted vertical scrolling

I have a React App where the user can toggle between different views of the same data structure. When toggling from one view to another, the browser window sometimes automatically scrolls vertically. Instead I am expecting the window to not scroll when possible.
The CodeSandbox here reproduces the issue:
https://codesandbox.io/embed/magical-chebyshev-otlpu?fontsize=14&hidenavigation=1&theme=dark
If you scroll down, then click on "CLICK TO SWITCH VIEW BELOW", you will notice that there's an automatic scroll to the top happening.
I suspect this is an issue with MUI TextField. If I change the MUI TextField to a div, the issue does not show up, so I don't think this is due to React.

ant-design collapse ,only one paneland it's content should show at a time

I'm using ant-design collapse so when I expand particular panel ,only that particular panel and it's content should display and other panels should not show at all,when I click on collpase only all panel should show,how to achieve this.
I'm using accordian here,
this is the link
https://ant.design/components/collapse/
But here when I click on partiular panel it's content is showing and also other panel is appearing, but I want other panels also should not show
Thank you

How to align Angular Multiselect from the bottom

I am looking for align the Angular Multiselect from the bottom.
Problem is activating that dropdown will display it beneath the clickable trigger, no matter where on the screen it is. If the trigger is at the very bottom of the page, when clicked the dropdown will increase the page height, and the user will have to scroll down again to see the rest of the dropdown
code link
Thanks.
There is a dropup feature in bootstrap.
Referece: http://getbootstrap.com/components/#btn-dropdowns-dropup

Jquery-ui: Reloading and refreshing accordions in inactive tabs sets height of accordion panels

I have a page with a set of tabs, two of which contain accordions. I have several AJAX functions that reload the content of both sets of accordions, and once complete, I refresh both of them.
While the accordion of the currently active tab refreshes just fine, the one in the inactive tab does not. It opens the top accordion panel, and its height is just fine. But when you activate any other panel, it only has the minimal height and adds a scroll bar.
How can I get the accordions in the inactive tabs to maintain the proper height?
Hi i believe ur issue is similar to this thread, pls check out these links. JQuery Accordion Auto Height issue http://jqueryui.com/accordion/#no-auto-height

extjs 4 scroilling WITHOUT a scrollbar

I have this narrow panel which is basically a list of thumbnails, and i need to be able to scroll over them using buttons.
We have a panel (anchor layout), with containers in it, and each container contains the image.
there isn't space for a scrollbar, and anyway we don't want one.
I thought it would be as easy as in the listener for my button calling panel.getEL().scroll('b',20)
but this isn't working because the scrollHeight === ClientHeight so scroll does nothing.
Is there a technique I am missing or should this work?
So you're using a button to scroll through the images? What about having the button's listener remove/hide the containers/images at the front of the panel to allow the others to use the space?

Resources