Richfaces: menu key binding - menu

I got a richface issue that rather looks very easy, but i can't find the answer.
I want to acces a (dropdown)menu with keybindings. Once the menu has focus i can use the arrow buttons without a problem. I just cant get the 'focus' on my menu with a hotkey
XHTML:
<rich:dropDownMenu
binding="#{menuBarBean.menuBar}"
id="main-menu"
showEvent="mouseup"
onclick="showMenu();"
/>
<rich:hotKey enabledInInput="true" key="ctrl+M" onkeyup="displayMenu()" preventDefault="true" />
JavaScript:
function displayMenu(){
#{rich:component('main-menu')}.show();
**// Do something that sets focus on the richface menu component**
}
In short:
How to get the focus on
#{rich:component('main-menu')}
with:
<rich:hotKey />

jQuery has a .focus() method that focuses things:
#{rich:component('main-menu')}.element.focus();

Related

Problems making JavaFX TextField and TextArea editable

I have a JavaFX Application which opens an auxiliary Stage. The Stage itself contains a TextArea and a TextField, both marked as editable in Scene Builder, and neither of them with any bindings for the TextProperty (as far as I know). Even so, I am unable to type anything into these fields.
What might be blocking the editing?
The relevant FXML is as follows:
<HBox prefHeight="100.0" prefWidth="200.0">
<children>
<Label prefHeight="26.0" prefWidth="89.0" text="Query name:" textAlignment="RIGHT" />
<TextField fx:id="queryNameTextField" prefHeight="26.0" prefWidth="518.0" />
</children>
</HBox>
With some further tinkering I have noticed that the new window I open does not always have focus, even when the TextField itself does! I say this because the title of the window is greyed out.

Is there a way to change behavior of rich:panelMenu collapse/expand?

http://showcase.richfaces.org/richfaces/component-sample.jsf?demo=panelMenu&skin=blueSky
The above link has a demo which is similar to what we have on our application, but we would like for the collapse/expand behavior to act a little differently.
We have our menu starting completely expanded, but we basically want the user to have complete control over collapsing and expanding the menus. For example if you open the top one in the demo and then open the second one the first one closes. Is there a way to only collapse and expand onclick? This seems like it should be the default behavior.
So basically here is what I have:
<rich:panelMenu>
<a4j:repeat>
<rich:panelMenuGroup>
<a4j:repeat>
<h:link />
</a4j:repeat>
</rich:panelMenuGroup>
</a4j:repeat>
</rich:panelMenu>
I want to be able to open and close each rich:panelMenuGroup without it affecting the rest of the other rich:panelMenuGroup elements.
It's as simple as: <rich:panelMenu expandSingle="false">

javafx new "screen" in same tab

I have a piece of code like this :
<Tab text="A" fx:controller="myController" xmlns:fx="http://javafx.com/fxml">
<content>
<VBox>
<children>
<fx:include fx:id="topTab" source="../top-tab.fxml"/>
<AnchorPane prefHeight="600" VBox.vgrow="ALWAYS">
<!-- insert code here -->
</AnchorPane>
<AnchorPane id="bottom_anchor" prefHeight="250" />
<fx:include fx:id="bottomTab" source="../bottom-tab.fxml"/>
</children>
</VBox>
</content>
</Tab>
Right now, the 'insert code here' part has a list of links to youtube videos. The idea is, when the user clicks on one of these links, to show IN THE SAME AnchorPane the video and the list disappears. It would be like another screen (with a nice transition if possible) that appears while the list disappears, all inside this AnchorPane as I need to stay there.
I have thought about using a StackPane and making things visible or invisible as needed, but that seems... strange.
As I am new to JavaFX, any answer explained as to a 9-year-old would be appreciated
Thank you all !
Easiest way I think is to add 2 AnchorPanes inside the AnchorPane you already have. Let's call them pList and pContent. Then play with the visible property of them.
To make a nice transition you can do something like this:
FadeTransition showTransition = new FadeTransition(Duration.seconds(.1), pList);
showTransition.setFromValue(0.0f);
showTransition.setToValue(1.0f);
showTransition.play();
Do it the other way for pContent.

How to open a modal aspx page from the devexpress aspxpopupcontrol

I have a button which should open a web form from my project in a modal window. How can I achieve that with the devexpress popup control?
Use the Popup Control - Content URL to show another webform in the control. open popup on the button's client click event.
example:
<dx:ASPxPopupControl ID="popup" runat="server" ContentUrl="~/ContentPageWithTextBox.aspx"
Top="100" ClientInstanceName="clientPopup" CloseAction="CloseButton">
<ClientSideEvents Shown="OnShown" />
</dx:ASPxPopupControl>
Check this search Result
Reference:
How to manipulate client-side objects within a ASPxPopupControl with the specified ContentUrl - check example also.
Hope this help...
Here is sample code:
<input id="openBtn" type="button" value="Open popup"
onclick="myPopup.SetContentUrl('http://www.google.com');myPopup.Show();" />
<dx:ASPxPopupControl runat="server" ClientInstanceName="myPopup" Modal="True"
CloseAction="CloseButton" Width="500px" Height="400px"/>
ASPxClientPopupControl members
ASPxPopupControl members
See ASPxPopupControl Online Demos and the Code Central Examples to learn more on how accomplish this task.

How to set <aui:button> icon in Liferay without using Javascript?

I'm trying to set icon to <aui:button> like on this tutorial.
But solution described there doesn't work well in my case, because I have a table and on each row I have a button with different resourceUrl. Like this:
<portlet:resourceURL id="saveReport" var="saveReportURL">
<portlet:param name="reportId" value="${report.reportId}" />
</portlet:resourceURL>
<aui:button onclick="location.href = '${saveReportURL}'">
Is it possible to set icon in <aui:button> without using JavaScript as described in tutorial?
Thanks
You can write this below code for setting icon in liferay alloy button
<aui:button type="cancel" cssClass="btn-info" icon="icon-upload-alt" iconAlign="right" value="upload" />
you need to use the icon attribute for this setting "Icon glyphs"
you need to use cssClass for adding extra design button class for the designing
you need to set iconAlign attribute for left or right side of the button text value
You should be able to add an icon to a button without using JavaScript by adding one of these Icon CSS classes to your button. For example, if you wanted to create a button with a calendar icon, your code should look something like this:
<aui:button class="icon-calendar" ... />

Resources