parameterized modal panel?

[quietgenie]

Is it possible to pass arbitrary parameters to the modal panel when the call to show the modal panel is made?

For instance, let's say I have the items of a shopping cart listed in a dataTable. For each record, I have a link to delete the record. When the link is clicked, I would like to display the modal panel confirming the user's choice. Then, when the choice is confirmed, I would like the delete action to occur.

Currently, I need to use one modal panel per record. However, I would like to be able to use just one modal panel for all of the records. To that end, I would need to pass some arbitrary parameters to the modal panel when I call RichFaces.showModalPanel('someId'). I know that you can define some of the physical attributes of the modal panel when the call to showModalPanel is made, but I have no idea how (or even if it's possible with the current code-base) to pass other attributes.

If anyone knows the answer, I would be most interested in it.

[sergeysmirnov]

Yes, having only one modal panel instead of one per record is a preferable approach.

Sorry, but I did not understand completely what do you mean by parameters here. Could you post code snippet to show that your case.
This code might not work. It does not matter. Just show what code you want to have and expect it should work.

[quietgenie]

Maybe something like:

<a href="javascript:Richfaces.showModalPanel('myPanel', {itemId:${item.id}, itemName:${item.name}})">Delete</a>

where "item" is the name of the var attribute of the dataTable.

Then, the references (itemId and itemName) should be accessible using EL notation in the modal panel.

I would not mind specifying a parameter list in the modalPanel tag (i.e. <rich:modalPanel parameterNames="itemName,itemId" />), but ideally, that would be unnecessary.

Please let me know if you would like for me to explain further.

[nbelaevski]

Hello!

Seems I get the point right. I've filed JIRA issue: http://jira.jboss.com/jira/browse/RF-130

[damianharvey]

How can I use this functionality to display data in a modal dialog?

I have a list of records in a dataTable and wish to click on a link that lauches a modal dialog which will display some further information about the record selected - in this case a comment.

I have the link opening like this:

<a href="javascript:Richfaces.showModalPanel('mp1',{width:300, top:200, commentVar:'#{myObject.comment}'})">
 <s:graphicImage style="border:0;" rendered="#{myObject.comment != null}" value="/img/comment.png" />
</a>

How do I then access this parameter ('commentVar') in the modalPanel?

The JIRA would seem to indicate that it is accessed via something like:

document.write(event.parameter.commentVar);

Would this be right?

Thanks,

Damian.

[cliffwiggs]

"damianharvey" wrote:
How can I use this functionality to display data in a modal dialog?

I have done something similar via a backing bean.

<h:graphicImage value="#{face.image}">
 <a4j:support event="ondblclick" reRender="popupDetail" oncomplete="Richfaces.showModalPanel('popupDetail')">
 <a4j:actionparam value="#{face.parameter}" assignTo="#{popupDetail.parameter}" />
 </a4j:support>
</h:graphicImage>

Then the modal panel uses the popupDetail bean to display the parameter and anything else it needs to. In my case the parameter is a GUID to identify which objects detail to display.

[baskerg]

CliffWiggs,
Can you please post your code? I have a similar problem. I need to pass a parameter to the <rich:modalPanel>


Thanks

[cliffwiggs]

Its just a sample. but does this work for you?

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE faces-config PUBLIC "-//Sun Microsystems, Inc.//DTD JavaServer Faces Config 1.1//EN"
 "http://java.sun.com/dtd/web-facesconfig_1_1.dtd">
<faces-config>
 <managed-bean>
 <managed-bean-name>demo</managed-bean-name>
 <managed-bean-class>demo.web.DemoBean</managed-bean-class>
 <managed-bean-scope>session</managed-bean-scope>
 </managed-bean>
</faces-config>

<%@ taglib uri="https://ajax4jsf.dev.java.net/ajax" prefix="a4j" %>
<%@ taglib uri="http://richfaces.ajax4jsf.org/rich" prefix="rich"%>
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>

<HTML>
 <HEAD> <title>Demo Page</title> </HEAD>
 <body bgcolor="white">
 <f:view>
 <h:form id="form">
 <a4j:commandButton value="Foo" reRender="demoPopup" oncomplete="Richfaces.showModalPanel('demoPopup')">
 <a4j:actionparam value="Foo Title" assignTo="#{demo.demoTitle}" />
 <a4j:actionparam value="Foo Message" assignTo="#{demo.demoMessage}" />
 </a4j:commandButton>

 <a4j:commandButton value="Bar" reRender="demoPopup" oncomplete="Richfaces.showModalPanel('demoPopup')">
 <a4j:actionparam value="Bar Title" assignTo="#{demo.demoTitle}" />
 <a4j:actionparam value="Bar Message" assignTo="#{demo.demoMessage}" />
 </a4j:commandButton>

 <a4j:region id="demoPopupRegion">
 <rich:modalPanel id="demoPopup">
 <f:facet name="header"><h:outputText value="#{demo.demoTitle}"/></f:facet>
 <h:commandButton value="Close" onclick="Richfaces.hideModalPanel('demoPopup')"/>
 <h:outputText value="#{demo.demoMessage}"/>
 </rich:modalPanel>
 </a4j:region>
 </h:form>
 </f:view>
 </body>
</HTML>

package demo.web;

public class DemoBean {
 private String demoTitle="DefaultTitle";
 private String demoMessage="DefaultMessage";

 public String getDemoMessage() {
 return demoMessage;
 }
 public void setDemoMessage(String demoMessage) {
 this.demoMessage = demoMessage;
 }
 public String getDemoTitle() {
 return demoTitle;
 }
 public void setDemoTitle(String demoTitle) {
 this.demoTitle = demoTitle;
 }

}

[dougthug]

This is an excellent example. Thank you so much for being so complete. I get confused/annoyed so often when someone tries to offer help but only give half an answer and I'm no better off then before I had asked. Although, it didn't work for me until I set the name attribute for each actionParam. It just wouldn't set the variable in my controller. Again, brilliant example, just in case it doesn't work for anyone else, give the name attribute a try. Thanks.

[cliffwiggs]

"dougthug" wrote:
This is an excellent example. Thank you so much for being so complete.

You are very welcome. I don't like half answers either, so i try not to do that in my examples.

Interesting note about the Name attribute. I'll try that the next time something doesn't work for me. Several examples do or don't work on my Dev machine from time to time.

[caye]

Hello, i have been trying to do the same from a rich:datagrid to a modalpanel and has been impossible.

My idea is to do a calendar with a datagrid so then i can click in each cell of days (entity day) and open a modal panel where i can add or edit events to that day.

My version of richfaces is 3.1.1. Seam 1.2.1 and Jboss 4.0.5 in this enviroment.

Well untill where i could reach, is supose that you can pass a parameter to a modal panel using

Richfaces.showModalPanel('panelId', {left: auto}, {param1: value1});

so i did at the begining

<a4j:commandLink value="try" reRender="addEventPopup" onclick="Richfaces.showModalPanel('form:addEventPopup', {resizeable: false}, {param1: 'FOO'})">

And the modal panel:

<h:form id="form">
 <a4j:region>
 <rich:modalPanel render="true" id="addEventPopup" height="400" width="400">
 <f:facet name="header"><h:outputText value="#{param1}"/></f:facet>
 <h:commandButton value="Close" onclick="Richfaces.hideModalPanel('addEventPopup')"/>
 <h:outputText id="text" value="#{param1}" />
 </rich:modalPanel>
 </a4j:region>
</h:form>

Ok, well, this way doesnt seems to work, even been what is in the developers guide of richfaces and in the jira is supose to be fixed. Then i also tried with two parameters instead of three and neither seems to work.

finally have tried also all the examples i could find, and still doesnt work, does anyone have any clue of how can i do this? Thanks in advance!

[dmitry.demyankov]

Try putting h:form inside modalPanel.

[caye]

No, still nothing...

[maksimkaszynski]

As I can see through the code you want to show modal panel first, and then re-render it. Such an approach will most likely not work, as modal panel performs several DOM changes while showing up.
I would suggest you to show modal panel in oncomplete, but due to http://jira.jboss.com/jira/browse/RF-932 it won't work either.
Put some container like a4j:outputPanel into modal panel, and reRender that container. It will work in both onclick and oncomplete.

[david.spark]

I use this for a diary type interface:

<a:jsFunction name="diaryPanelGen"
 reRender="detailsPanelHeader,detailsPanelTable"
 oncomplete="Richfaces.showModalPanel('details')">
 <a:actionparam name="id" assignTo="#{diaryManager.selectedDiaryDayID}"/>
</a:jsFunction>

The for the panel itself:

<rich:modalPanel id="details">
 <f:facet name="header">
 <rich:toolBar itemSeparator="line" id="detailsPanelHeader">
 <h:outputText value="#{diaryManager.selectedDiaryDay.date}">
 <s:convertDateTime type="date" pattern="EEE dd MMM"/>
 </h:outputText>
 <h:outputText value="Events:#{diaryManager.selectedDiaryDay.events.size()}, "/>
 <h:outputText value="Staff:#{diaryManager.selectedDiaryDay.staffQuantity}"/>
 </rich:toolBar>
 </f:facet>
 <f:facet name="controls">
 <h:graphicImage value="/img/back.gif" style="cursor:pointer" onclick="Richfaces.hideModalPanel('details')" alt="Close"/>
 </f:facet>
 <h:dataTable id="detailsPanelTable" value="#{diaryManager.selectedDiaryDay.events}" var="event">
 <h:column>...

Which is a long way of saying that what the previous poster said is right, don't reRender the panel itself but rather the contents of it :-)