Develop Reference

Overridding the label of "ok" button in <af:dialog> component in ADF

In web layer of my project I am using ADF Faces component.In places I have used ADF popup element nested with dialog.
<af:popup id="myPopup" popupFetchListener="#{.....}">
<af:dialog contentWidth="400" title="Dialog Title" contentHeight="100" closeIconVisible="true"
modal="true" type="okCancel" id="d3"
dialogListener="#{mybean.myDialogListener}">
</af:dialog>
</af:popup>
In my backing bean I'm trapping the "ok"/"cancel" event with the help of DialogEvent class.
I want to change the label of framework build "ok" button to some custom label based upon my project requirement.If I add the desired label in message bundle how to reflect that in framework generated button?
Can anyone provide any clue for this?

You have to use the Type, AffirmativeTextAndAccessKey and CancelTextAndAccessKey properties of the dialog element.
To have the "ok" display "yes please" :
<af:popup id="myPopup" popupFetchListener="#{.....}">
<af:dialog contentWidth="400" title="Dialog Title" contentHeight="100" closeIconVisible="true"
modal="true" type="okCancel" id="d3"
dialogListener="#{mybean.myDialogListener}" type="yesNo" affirmativeTextAndAccessKey="yes please">
</af:dialog>
Note : it will change the type of the response in your dialog listener from
dialogEvent.Outcome.ok
to
dialogEvent.Outcome.yes

How to click on an element using its Id and Value attributes together?

I am trying to click on some button (which becomes enabled after all of the fields are fill in):
<div class="savCancelContainer">
<input type="button"
value="Save"
translatekey="ACTVITY_DETAILS_SAVE_BUTTON"
class="translate" id="submitActivityDetails"
style="background-color: rgb(0, 125, 195);">
The programmers of the web-page have changed it for some reason, and now my code is no longer working correctly (the button doesn't get clicked on):
driver.findElement(By.id("submitActivityDetails")).click();
I also tried finding it by xpath, with no success.
Is there any way to click the button using the Id and Value attributes together?
Any other ideas?
Similar pages and dialogs are still working fine...

You need to create a xpath which will contain both the attribute:
//input[#id='submitActivityDetails'][#value='Save']
And Click event can be triggered in the following way:
driver.findElement(By.xpath("//input[#id='submitActivityDetails'][#value='Save']")).click();
Lemme know if it helps!

Additionally you can use css seelctor to perform that action too.
[id='submitActivityDetails'][value='Save']

JSF PrimeFaces MenuBar dropdown submenu disapearing after hover in p:layout

Doing some application in JSF PrimeFaces 3.1.1 (still learning) and I implemented full page layout - Sunny (the <p:layout /> tag). Everytihng is fine, except my menu bar.
On hover on the submenu button in the menu, the dropdown submenu shows, but when I want to go by mouse to the submenu, it disappears. The only option is to change the mouse position to the submenu very fast - than it stays. And thats the problem, need it to work normally, not dissappearing.
If I put the layouts out, the menubar works well again. Also tried to copy & paste code from PF showcase, issue was the same.
Using JSF 2 on Tomcat 7.0.22.0. Here is something of my code...
The menubar in a template:
<p:layoutUnit position="north" size="130">
<ui:insert name="top">
<p:menubar id="mainMenu" model="#{menu.mainMenu}" />
</ui:insert>
</p:layoutUnit>
The CSS solving overflow problems:
.ui-layout-north .ui-layout-unit-content {
overflow: visible !important;
}
.ui-layout-north {
z-index: 30 !important;
overflow: visible !important;
}
Thanks for help!

Did you happen to set a custom font size for your ui-widget? Personally, I had the following CSS setting:
.ui-widget {
font-size: 12px !important;
}
and I experienced similar issue like yours in Firefox (but not in Chrome). Oddly enough, after increasing font-size to 13px the problem was fixed.

The menubar works in IE or Chrome but in firefox don't show correctly you can see that in Check this with firefox a see what happen :)
I solve this problem with
.ui-menubar .ui-menuitem-text {
font-size: 13px!important; top: -1px;
}

This is not ideal but it solved the problem for me:
.ui-menuitem-link
{
max-width: 180px;
}

Please view next link http://forum.primefaces.org/viewtopic.php?f=3&t=16597.
It's a matter of font with.
This appear also in Firefox 27 and Prime Faces 4.0 RC.
In other browsers works well.

Panel Popup In JSF 1.1

Is it possible to have panel popup window in JSF 1.1 ? I would like to display a popup window when I click edit button and then would like to have few components in that panel popup window.
I am not using any other JSF like icefaces or richfaces, just plain JSF 1.1.
Any help is highly appreciable.
Thanks

Yes, it's definitely possible. Just bring in some good shot of JavaScript and/or CSS to show/hide and style the popup window. That's also what the average component library like RichFaces is doing with the only difference that it's all wrapped in a simple JSF component.
At its simplest you can use JS window.open() on click of a button/link.
<h:commandButton value="Edit" onclick="window.open('edit.jsf?id=#{item.id}'); return false;" />
The window.open() allows for fine grained customization of the window, such as the size and the browser bars which are to be displayed/hidden. Read the MDN documentation to learn about them. Returning false is mandatory to prevent the button from unnecessarily submitting the form.
Then, in the constructor of the backing bean associated with edit.jsf, you can grab the item by the id which is been passed as request parameter.
private Item item;
public EditItemBean() {
String id = (String) FacesContext.getCurrentInstance().getExternalContext().getRequestParameterMap().get("id");
this.item = someItemService.find(Long.valueOf(id));
}
Nasty, but that's what you get with JSF 1.1 which doesn't offer a JSF 1.2-supported #PostConstruct annotation or JSF 2.0-supported <f:viewParam> tag.
Finally, in the edit.jsf you need to bring in some conditionally rendered JavaScript piece which reloads the parent window (so that the edited data is redisplayed) and closes the popup window.
<h:form>
...
<h:commandButton value="Save" action="#{editItem.save}" />
</h:form>
<h:panelGroup rendered="#{editItem.success}">
<script type="text/javascript">
window.opener.location.reload(true);
window.close();
</script>
</h:panelGroup>
Set the success boolean in the action method when the saving is successful.
public void save() {
// ...
this.success = true;
}
There exist also solutions using a so-called "overlay window" dialog which is basically <div> which is positioned using CSS position: fixed; and spans the entire browser window with a transparent background and then therein another <div> which is centered and contains the real form. This however requires a bigger shot of JS/CSS. This is also what the average JSF component library and JavaScript framework/plugin (such as jQuery or YUI) is basically doing. It's only trickier to get it work seamlessly together with JSF as you would of course like to redisplay the popup when a validation error on the popup form occurs and that kind of things. It's much easier if you're using an ajax-enabled JSF implementation/library.

Howto set focus in Rich Faces panelBarItem?

Hi
I want to set focus on <h:inputText> element whenever rich:panelBarItem is opened.
I have:
<rich:panelBar>
<rich:panelBarItem onenter="setFocus();">
<h:inputText value="#{bean.value}"/>
</rich:panelBarItem>
</rich:panelBar>
it works fine when I open it with mouse click, but does not work first time when first panelBarItem is automatically opened.
How should I set focus on first opened panelBarItem? I really would like it to be some event(I could not find) on rich:panerBarItem or rich:panelBar.

You can call your method after page load to set focus to field. Something like
<script>
//call after page loaded
window.onload=setFocus();
</script>
or
<body onload="setFocus();">