Hi how do create dynamic tabs? I wrote like this for 2 tabs. If it is more, it automatically adds those tabs. Can you please help with this?
From that, it should create 2 tabs. And it should set the correct URL when you click on the tab. If it gets more dictionary items in the array then it creates more tabs
What your searching for is React.createElement.
You can create a component from a string :
React.createElement('Upgrade')
for example.
However, dynamically creating a function in Webshop seems not feasible.
If you only need to do a history.push(PATH), I would recommend putting the function inside an onClick event. I'm not sure how do you want it to work.
Related
I'm new to reactJS, get confused when trying to create dynamic (antd) tab.
Basically, i have two layers in Application, the first one is Sidemenu Bar, located on left of the screen, and the second layer is content pages, which represented with Tabs.
The Sidemenu has some variable numbers of menu buttons (modules). When each button are pressed, then React will render that module (each module represent by individual JSfile) to the content layer, inside a new Tab panel. The module page itself, can be duplicated on the Tab.
To do that I created a sidemenu.js which contain a menu buttons (and its corresponding URL), and appPages.js to hold that Tabs that will render the specific module(s).
How to make it possible ? where I should write the routes (react-router-dom) ?
I search for this topic, and found it solved using the same js file, not the separated file or component.
Please check my sandbox here : https://codesandbox.io/s/dynamictabs-83mop
Thank you. Really appreciated for any help, and so sorry about my english.
So right now I'm trying to build this radio list for the regions in LWC, the functionality works fine in that when you click on the regions it selects all the states below for that region.
https://i.stack.imgur.com/y2MM8.png
However, I want to stylize it so that it looks more proper. I'm a little confused how to do this using these components that LWC provides. Here's a mockup of what the regions should look like.
https://i.stack.imgur.com/A26PH.png
Here's what the HTML for it looks like.
https://i.stack.imgur.com/1vWcy.png
You can probably achieve this by using the grid system : https://www.lightningdesignsystem.com/utilities/grid/
We can achieve the same style by following a couple of steps:
Pass class to each lightning inputs to scope the styling.
Style radio controls having the passed class name.
save the file as .css and store in static resources.
Load style sheet in component by making use of loadStyle method from platformResourceLoader module.
I'm new using Codename One. I'm doing an app which have a Form, that has a Tab component with 14 tabs inside, every tab has a gridlayout with 42 buttons, and I want to change a property in one button.
The problem is that I don't know how to reach that button.
tabG.getContentPane().components.get(index)
tabG is the tab component, and I can reach the tab that I need, but after that I don't know how to reach the button index I want to change.
I tried
tabG.getContentPane().components.get(index).components.get(indexbutton)
But even can't compile this code.
I'll apprecciate any help.
When you create the tab you need to prepare information to find the component later. E.g. if all tabs derive from the same class then just do something like:
MyBaseContainer cnt = (MyBaseContainer)tabs.getTabComponentAt(index);
Button theButtonINeed cnt.getMyImportantButton();
If this is more complicated you can use setName() or putClientProperty to prepare hints for you during form construction.
I'm a novice at Swift programming.
I've created an app with multiple identical buttons. I created one button with an action and then copied this button multiple times so that it uses the same action.
When one of the buttons are pressed, the image for the button changes ('image2' from 'image1'), and the button is disabled.
All good and fine so far.
I've then tried to create a reset button, where the buttons that have been pressed are enabled again, and the image for them changed back to 'image1'.
I did this by creating a collection outlet for a single button and then adding some of the other ones, one-by-one.
#IBOutlet var mybuttons: [UIButton]!
As I understand this creates an array with the buttons.
I then go over this array and update the image and enable the button, with a loop:
for myBubble in self.bubble
Now, my question is: Instead of having to drag each and every button to the outlet collection, would it be possible to add them to an array when they are pressed, and then run over that array instead?
I tried to create an array with
var mybuttons: [UIButton]!
and then use append(sender) when a button was pressed, but this gave a fatal error.
As mentioned I could solve this by simply adding all to an outlet collection but was wondering if there was a more elegant way to do it, since there are quite a lot of buttons.
As mentioned I'm a novice at this.
Thanks in advance.
Best regards,
Thomas
You have just declared your button array but not initialized it:
var myButtons = [UIButton]()
This way you declare and initialize an empty array and you can start to append your objects to it.
I'm trying to create a 2 level tab navigation with each sub-tab has dynamic UI content. I'm trying to have the whole UI created from JSON definition with main TABs array where each tab contain sub-tabs array. Each sub-tab contain UI elements such as text, combobox, radio button, multi-select list, etc...
I'm looking at this tab example and trying to combine it with dynamic content for the inner tab. Since I am new to angularjs I just hope to get some help to get me started.
http://plnkr.co/edit/QSvqd3hSqa8BUYU9eKaO?p=preview
You may want to consider Metawidget for AngularJS, as it does much of the hard work around "creating a UI from JSON definition" for you. Here's a tutorial that creates a UI using JSON schema: http://metawidget.org/doc/reference/en/html/ch01s02.html