I am using antd tabs and I have 2 tabs on my page. Both load at the same time but I want only the first tab to load on mount and onchange of tab the other tab should be rendered. I am unable to achieve this functionality.
Is there a way to resolve this issue?
According to the documentation, the default for the forceRender prop on the Tabs.TabPane component in your code should be false.
The prop is used to: Forced render of content in tabs, not lazy render after clicking on tabs:
https://ant.design/components/tabs/
On what basis are you assessing that the content is not lazy rendered? Perhaps you can share some code.
Beyond this, you may want to handle more complex rendering within your component tabs using state.
I hope this helps.
Related
I'm using Oracle Apex 19.1
I got a page with 4 tabs in a Region Display Selector. When it comes up to a page reload you can see all tabs while the page is loading. It's not a second but you see the content of all tabs among themselves flashing.
I tried to set a staticID on the Region Display Selector and use it in the css with display:none with a Dynamic Action on Page Load i call the show True Action on the Region but it's still the same effect with all tabs flashing.
Is there a method i can prevent this?
Thanks for any advise and help
I avoided this by putting a custom attribute in the region.
Have you tried setting the server side condition to
Item != Value
for a particular hidden value
then create a page load process to set the value.
Then the regions should appear after the page loads.
I have page with tabs (which are actually links handled by parent pjax). Which loads the tab content via pjax calls.
In one of the tabs, I have a gridview which is inside a pjax container. So that makes it a nested one.
The problem is that the nested one when loaded and inserted into the page, does not include it's own javascript i.e:
jQuery(document).pjax("#history-gridview a", "#history-pjax", {"push":true,"replace":false,"timeout":5000,"scrollTo":false});
You need to call renderAjax() when requesting the tab page (or content). I do something like this:
if (Yii::$app->request->isAjax) return $this->renderAjax('myview');
else return $this->render('myview');
However, it may not fix your problem. I've found if I navigate tabs and a grid is loaded dynamically in the tab (with its own pjax container), then any interaction with grid sort and filter tries to reload from the outer (pjax tab) container even with skipOuterContainers set to true.
On a side note, the developers are thinking of dropping pjax support completely as per here as well as how asset bundles work.
The question remains:
How to create super fast performance like an SPA (single page app)
without Angular2 or similar? The grid container within a tab container
is the perfect example which, if could be achieved (catering for
back/forward buttons, initialisation scripts) would be awesome.
hi is it possible to create/ extend from tab navigator or another component to create a tab navigator where tabs are within tabs. I.e grouped. I have been trying to find some info on this but there is very little available. I have attempted to do something as follows but I cannot successfully get it to work. Any expansion or information on this would be great
Thanks
You can try Flex MenuBar with custom skin for it. Or, maybe it will be easier, you can try to write own component based on Spark ButtonBar (or TabBar) with List as suggested in Flex: Skinning menuBar - is it possible?
I am porting a Desktop WPF application to WinRT and I'm facing a little issue.
I had a ItemsControl and I had a context menu on every item to delete / edit the item.
I have been told that PopupMenu are not good in WinRT and I should use a AppBar.
I think I'm doing something wrong or I misunderstood that.
I thought that I could put that options on a AppBar and when I select an element, popup the bar and click where I need.
The problem is that the AppBar will show up when I right click on any part of my app, so that buttons will show up with an item selected.
So can I change the layout of the AppBar on different contexts (because it seems that Microsoft wants us to use AppBar as context menu without context capabilities) or only show it when I want via code?
Would be good to have a TopAppBar with some App-wide options and a BottomAppBar just for ListView's item context menu.
Or maybe I'm doing all this stuff wrong and I have to use another approach to put extra options on the Listview's items.
You are thinking about this correctly. AppBar is the place where you should put all your non-essential and selection based commands.
The guidelines here and here suggest that they should be arranged as follows:
Navigation commands should be in TopAppBar
Commands related to selection should on the left side of BottomAppBar
The rest of page specific commands should be on the right side of BottomAppBar
Contextual commands should only be shown when a relevant item to that command is selected. For that purpose you should set Visibility of these commands accordingly. Also AppBar should open automatically when an item with contextual commands in it is selected. You can do that programmatically by setting its IsOpen property. You should also set it to sticky mode by via IsSticky property.
If you're using MVVM you can bind your viewmodel properties to all Button and AppBar properties mentioned above.
There's a CustomAppBar control available in WinRT XAML Toolkit. I haven't used it myself yet but it has a couple of extra features that might prove useful in your case.
I have a (JSF 2.0/ Primefaces 2.2RC-SNAPSHOT) app that has
<p:layout>
I use a lot of dialog in my application and before the newest version of primefaces came out there was no way to display a dialog with a modal on top of the layout without putting the dialogs outside of the tags.
So I did just that. The issue I am having now is I am noticing that constructors and postcontructs are being called when my application is loaded. This is because the view with the layout is being loaded and therefore all my dialogs are being loaded.
I don't want these constructors being called until I am actually dealing with the appropriate views in my application.
I have been testing the appendToBody attribute on the
<p:dialog>
tag but it seems really buggy. Everything works fine on the initial rendering of a view. I can open a dialog close it etc and it works fine. If I navigate away to another view and then come back to the initial view and open the dialog, everything is running off the page. The dialog window is in the correct place but the content is not.
My question is 1. Is there a way I can have the dialog windows outside of my layout as a child of the
<h:body>
without having all the managed bean constructors associated with them initiated when the application loads?
Or does anyone know how to fix the alignment issue when using the appendToBody tag? Thanks.
When using layout and dialog, I usually place my dialogs outside of the layout as a direct child of the body element. I have a special ui:insert part in my page template for this.
appendToBody was added to make this easier, if it doesn't work well for you, give this approach a try. I know modal dialogs and layout can work this way.
without having all the managed bean constructors associated with them
initiated when the application loads
Maybe the managedbean gets loaded when your dialog is rendered.
Try rendering the dialog only after the button click, perhaps byputting rendered="#{mybean.flagLoadMyDialog}" on the dialog, and set the flagLoadMyDialog when the button is clicked using ajax.
Also remember to ajax-update the dialog after the button click.