I have a simple Tab Panel (tabpanel) where each Tab is a Form. By default, I want the Form to be disabled (read only), and editable once the user taps the Edit button. By setting the "disabled" config of the form, the Tab is also disabled (cannot tap it).
How can I disable the form while keeping the Tab enabled? I have a couple of solutions to fall back on, but I'm hoping for something cleaner/simpler.
My solutions so far:
Make the Tabs Containers and place the Form inside the Container
Disable at the Fieldset level
My current solution uses the Tab Panel's "initialize" event handler and calls "setDisabled(true)" on each Form Panel.
onTabPanelInitializer: function(component, options){
component.query('formpanel').forEach(function(element, index, array){
element.setDisabled(true);
});
}
Related
I have a tabbed form in Access and on one tab, I'd like to create an ActiveX TreeView object. When I go to build this object and drag it to the tab, it attaches itself to the general form instead of the tab. This puts the control over top of all the tabs instead of the tab I want it in.
How do I attach the ActiveX control to the tab and not the entire form?
I've done a number of different "moves" to try and get it to attach and I've looked through the options to see if there is an easy way to attach it but nothing actually defines how the control is attached unlike a normal Access form control that is contained in the tab.
I would like to keep the extra forms to a minimum and maintain a single, tabbed form with separate controls on each tab.
Answer:
Make sure to select the tab first and then create the TreeView control. TreeView controls cannot be attached to a tab page by drag/drop.
If done correctly, the control will be placed on the tab page just under the tab name within the borders of the tab page. A quick test by selecting other tabs can be done to check that it attached to the right tab and only that tab.
can I somehow set in what order the text fields become active after pressing the "Tab" button?
I think it depends on when you added the field and not where it is in the form. So can I change this or I should add the fields in the order I want to switch them with the "Tab" button?
Thanks!
There are at least a couple of ways to change tab order.
With the form in design view, right click on an area of the form without a control. On the context menu that appears, click on Tab Order. A dialog will open that will allow you to change the tab order.
Another method is via the property sheet for each control. On the Other tab there is a property for Tab Order. Just set it to whatever you like.
Is it possible to show a popup only in a certain gwt tab or a panel in that tab?
I've found methods to show a popups over the whole page, but not only in specific tabs.
When you switch the gwt tab, the popup should not be visible anymore and new popups should be able to be created, which again are only visible in the switched to gwt tab. Switching back to the other tab should then show the first popup again.
Optionally the rest of the tab, which is not covered by the popup, should not be clickable.
Are there any native methods for this? The gwt Popup Panel only seems to create popups for the whole page.
Edit: I've tried using smartgwts Window which seems to work just the way I want it to. When I switch the gwt-tab, the popup is no longer visible and returns when I switch back. The only problem is, that it isn't displayed right. The frame is placed on the far left side of the browser tab, while the content is displayed on the far left of the gwt-tab. If I move the content, the frame moves too. The frame is visible over the whole browser tab, while the content disappears if I drag it over the gwt-tab edge.
I guess it's because I'm adding a Window to a gwt-Panel. Is there any way to fix this without changing everything to smartgwt?
Not exactly, I think.
But, you can do something in the tab events, like hide the popup in tabs that it doesnt belongs. To avoid the lag of show/hide the popup, you can do this in the BeforeSelectionHandler, like this:
getView().getTabPanel().addBeforeSelectionHandler(new BeforeSelectionHandler<Integer>()
{
#Override
public void onBeforeSelection(BeforeSelectionEvent<Integer> event)
{
showPopupupsForTab(event.getItem());
}
});
In showPopupupsForTab you can show the popups for this tab (you can handle this with a map or something) and hide the others...
Something like this.
Hope it helps.
I'm using the TabContainer/TabPanel components of the Ajax Control Toolkit.
I'd like to hide the tabs themselves and use a button elsewhere on the page to activate (bring to the front) one of the tabs without posting back to the server.
I can show and hide the tabs by grabbing their clientIDs and manually setting the visibility and display styles.
But is there a javascript function I can call to do this and perform whatever magic happens behind the scenes when I click an actual tab?
Example:
var tab = $find(“tabContainer’s ClientID”);
tab.set_activeTabIndex(1); // active the second tab panel
tab.getFirstTab().set_enabled(false); // disable the first panel
Current solution:
user clicks on label and it is switched with a textarea to allow edit
user can leave edit with tab / enter and textarea is switched back to a label
The problem is the user has to click on the label with a mouse to get into edit mode.
I would like the label to recieve an onFocus event when the user clicks the TAB key and the label is the next widget in line.
Possible soulution (but have not tried yet) to inherit a new widget from the Label widget and implement the TabListener interface.
There is a panel called the focus panel. That panel allows widgets that normally dont receive events like keyboard events (e.g., a label is one) to have events.
checkout the docs here