How to set active tab in Tab from Material UI by code - reactjs

First time asking on SO, I know that this question was asked lot of times. I already visit all those posts but without sucess unfortunately.
As the title says, I need to change the active tab by code. I am using the material ui scrollable tabs with react.
I thought that the project I am working on maybe it has something bad, so I made this codesandbox to try without success aswell.
Could you please give me a hint on how to do this on the given example?
Thanks in advance for all the help, this community is awesome!
Best regards

If I understand correctly, you are looking for a way to manually set a tab, without hitting the actual tab button.
If yes, all you need to do is to change the state that holds the tab's value using setValue and provide the number of the tab you want to go (starting from 0).
e.g. setValue(2) will take you to the third tab.
You can take a look on this. I have created a static button that change the state to a specific number, just to demonstrate the idea.

Related

In AngularJS to display tabs using a mouse click and swipe

I need to create tabs that will get data from an array (using ng-repeat) for a set of questions. I need to display the page to answer a question for a particular tab and again need to keep the selected answer and to traverse to the other page can keep track of answers.
And at last will be able to see the unanswered question and answer at last. What would be some code for this?
I need to use it on a laptop as well on mobile.
Using ng-click, it is possible to keep click for laptop and (angular-touch) ng-swipe-left for tab. I have achieved the scenario.

Bootstrap dropdown-menu keyboard navigability

I have a nice and big dropdown menu (world countries) in my angularjs+bootstrap app.
I would expect I could use a keyboard alphabetical key to faster scroll the menu.
For example, hitting J I'd like to scroll to Jamaica entry...
Does a way to implement exist already, or I should think forking dropdown-menu?
There is a good stackoverflow article, Using Bootstrap typeahead with Angular, that has an answer that would likely help your cause. Using some version of a typeahead would work. The top two answers should point you in the right direction. Hope this helps

Is it possible to change the UI/behavior of the "Keyboard" button when in camera mode?

For example, instead of going to manual entry, simply go back to the previous page. I know it is possible to completely remove the button with the EXTRA_SUPPRESS_MANUAL_ENTRY option but I'm looking for a way to modify the button.
Sorry, the functionality you're looking for is not available.

ExtJs tab panel random disappear

I've an Ext.tab.Panel that contain in each tab some object (that are Ext.panel.Panel).
When I try to switch between tabs the items contained in the tab random disappear, like in the picture.
Is it a known issue or have I made a mistake?
Thank you
Marco
Thank you for comments.
I was having twice problems reported from zeke ank pllee.
For all people are having the same problem be careful how to use layout. I've set layout fit inside each element, removing all "layout" value it works.
However I've already had also pllee reported problem, with the same problem of layout render. Last time I've solved forcing doLayout() of all component in active tab

Any way To disable The next and Last Button Of PagingTollbar?

I'am Using pagination in my grid.The grid store have no data but in pagination toolbar the
next and last button is enable .What is the reason for that? I can't Understand it.
Any One Please Help me.
You can manage it. see answers of similar questions.
Also, you can enable/disable it by using methods of DOM elements, on afterRender function.

Resources