jQWidgets Forums
jQuery UI Widgets › Forums › Navigation › Tabs › No scrollbar when a tree inside a tab is expanded
Tagged: tree tabs
This topic contains 16 replies, has 2 voices, and was last updated by Loko 10 years ago.
-
Author
-
Hi
I face an issue when I put a tree inside a tab : when I expand the tree I can’t see its content because there is no scrollbar displayed in the tab bodyHow can I fix this please ?
Thank you
ArnaudHi Arnaud,
Please take a look at the provided example at: http://jsfiddle.net/6vfhx080/
JqxTabs is working with other widgets and as you can see from the example the scrollbar is displayed properly.Best Wishes,
MariyajQWidgets Team
http://www.jqwidgets.comHi Mariya
So, It works with your example but not with mine. Can you please tell me why ?
Hi Arnaud,
As you can see your code is not working and has no widgets initialized in it. Also your structure in the html part is invalid.
Best Wishes,
MariyajQWidgets Team
http://www.jqwidgets.comI don’t understand why you say it is not working (?). It works fine on my box on several browsers,
see this screenshotBut as you can see, there is not scrollbar in the tab so I can”t see the complete tree.
Hi Arnaud,
Are you sure that the provided example for your first post is the one from the screenshot? The given one is not working at all.
Best Wishes,
MariyajQWidgets Team
http://www.jqwidgets.comYes I am. But when I open it on an other box I get some errors, I don”t know why :
Blocage du chargement du contenu mixte actif (mixed active content) « http://jqwidgets.com/public/jqwidgets/styles/jqx.base.css »
Blocage du chargement du contenu mixte actif (mixed active content) « http://jqwidgets.com/public/jqwidgets/styles/jqx.energyblue.css »
Blocage du chargement du contenu mixte actif (mixed active content) « http://jqwidgets.com/public/jqwidgets/jqx-all.js »
Blocage du chargement du contenu mixte actif (mixed active content) « http://jqwidgets.com/public/jqwidgets/styles/jqx.base.css »
Blocage du chargement du contenu mixte actif (mixed active content) « http://jqwidgets.com/public/jqwidgets/styles/jqx.energyblue.css »
Blocage du chargement du contenu mixte actif (mixed active content) « http://jqwidgets.com/public/jqwidgets/jqx-all.js »Looks like all the external sources are blocked. I’m not very used on JsFiddle by the way, but if you cut and paste the code in your own new jsfiddle I guess it’ll run correctly.
I tried with jsfiddle alternatives and I face the same issue too :
CodePen.IoTested on latests IE ,FX and Chrome
Hi Arnaud,
You should use https. for your external links. As for the scrollbar, it may be caused because you don not initialized the jqxTree in the initTabContent.
Best Wishes,
MariyajQWidgets Team
http://www.jqwidgets.comHi Mariya
I just created my jsFiddle by forking an example on your website, and this example does not uses https.
Anyway, I don’t understand what you mean by initlializing the tree in the initTabContent. Can you give me a code to do that please?Hi Arnaud,
The jqxTabs have a ‘initTabContent’ function, take a look at the provided example at : http://jsfiddle.net/jqwidgets/2nbr7/
Using this example, you can initialize jqxTree instead of the button from the example.Best Wishes,
MariyajQWidgets Team
http://www.jqwidgets.comOK Mariya
So I use initTabContent in that new example, the tab content becomes somewhat scrollable with mousewheel, but the scrollbar is not shown properly and not really usable.
NB : with the new example, what I said about the scroolbar deals with Chrome. With Firefox there is no improvement : no scrollbar at all even with initTabContent
Hi Arnaud,
The example you provided us is not made with ‘initTabContent’. However, here is a working solution: http://jsfiddle.net/jqwidgets/og8trwbw/
Best Wishes,
MariyajQWidgets Team
http://www.jqwidgets.comIt works because you added an fixed height parameter to the jqxTree. I don’t want to do that because I want to take benefit of all the avaliable screen height, and ‘100%’ does not seem to be accepted .
And if I remove this parameter I face the issue again.It even does not work if you put a value higher than avalbale space, for instance height:500.
Hi Arnaud,
As far as I can see you are setting height to the jqxTree in your example:
$('#div_pages_acces_tree').jqxTree({ source: treeRecords, width: '100%', height:200});The difference is that it is used initContent and height is set to different value.If you do not use height, there would not be scrollbar.
Best Wishes,
MariyajQWidgets Team
http://www.jqwidgets.com -
AuthorPosts
You must be logged in to reply to this topic.