modal panel using componentcontrol

[sushma.w]

Unable to use the parameter provided in f:param in componentcontol in modal panel.
I am able to use it in rich:contextmenu with open and close {} braces. I am unable to use it in rich:modal panel. I would appreciate if some one can help me on how to display the values in modal panel. I am able to display the parameters in modal panel by assigning it to onshow="alert(event.parameters.detailpackagename) but not in textfieldI would like to include my code in here.

<h:outputLink value="#" id="link" submitMode="ajax">
 #{pkg.packageName}
 <rich:componentControl for="detailpanel" operation="show" event="onclick" >
<f:param value="#{pkg.packageName}" name="detailpackagename"/>
 <f:param value="#{pkg.packageId}" name="detailpackageid"/>
 <f:param value="#{pkg.description}" name="detaildescription"/>
 <f:param value="#{pkg.packageType}" name="detailpackagetype"/>
 </rich:componentControl>
</h:outputLink>
<rich: id="detailpanel" minHeight="300" minWidth="450" height="300" width="500" zindex="2000">
 <f:facet name="header">
 <h:outputText value="Package Details " />
 </f:facet>
 <table width="500px" border="0">
<tr align="left">
<td width="20">Package Title: </td>
<td>
<h:inputText value="(detailpackagename)"></h:inputText></td>
</tr>

Could some body please suggest me how to display these values.

Appreciate it,

[nbelaevski]

The code seems to be corrupted, could you please update it?

[sushma.w]

Sorry, I have included the complete code.

Thanks
Sushma

<h:form style=" height : 465px;">
<a4j:outputPanel layout="none">
<rich:dataTable width="100%" id="packageTable"
 rows="#{UI.rowsPerPage}"
 columnClasses="col1,col1,col1,col1"
 value="#{UI.pList}" var="pkg"
 first="#{ContentUI.firstRow}"
 rowKeyVar=" #{UI.firstRow}"
 rowClasses="odd-row,even-row">
<f:facet name="header">
 <rich:columnGroup>
 <h:column>
 <h:outputText styleClass="headerText" value="Package" />
</h:column>
</rich:columnGroup>
</f:facet>

<h:column>
 <h:outputLink value="#" id="link" >
 #{pkg.packageName}
<rich:componentControl for="detailpanel" operation="show" event="onclick" >
<f:param value="#{pkg.packageName}" name="detailpackagename"/>
<f:param value="#{pkg.packageId}" name="detailpackageid"/>
<f:param value="#{pkg.description}" name="detaildescription"/>
 <f:param value="#{pkg.packageType}" name="detailpackagetype"/>
</rich:componentControl>
</h:outputLink>
</h:column>
 </rich:dataTable>
<rich:modalPanel id="detailpanel" minHeight="300" minWidth="450" height="300" width="500" zindex="2000">
<f:facet name="header">
<h:outputText value="Package Details " />
</f:facet>
<table width="500px" border="0">
<tr align="left">
<td width="20">Package Title: title</td>
<td>
<h:inputText value="(detailpackagename)"></h:inputText>
</td>
</tr>
<tr align="left">
<td width="30%">Package Type: pack type</td>
<td>
<h:outputText value="#{detailpackagetype}"/>
</td>
</tr>
</table>
</rich:modalPanel>

[sergeysmirnov]

You completely miss the meaning of the parameters passed with componentControl. They are used as a parameters passed to the javascript method, in this case - show of the modalpanel dialog API. Those parameters have no relation to the content of the modal panel that is already formed on the server side and just hidden till you call show.
Even, those parameters somehow, magically, fill the field inside the modal panel, it will does not make sense for JSF. JSF does not work such way.

[sushma.w]

First i thought the same way but when i put the same table definition with in the context menu and menu item all these values were displayed in input and output text fields.

Is there any alternate way , to display this modal window with values.
I tried to use output link with "action" calling a backing bean method to assign values and then in "on complete" calling javascript to display values in modal panel but it is calling oncomplete before action event.
I ran out of ideas, I would appreciate if you can suggest me some solution to this issue.

Thanks
Sushma

[mail.micke]

Hi Sushma,

perhaps this cookbook page can help:
http://labs.jboss.org/wiki/en//RichFacesCookbook/DetailModalPanelFromTable
Mike

[sushma.w]

Hi Mike ,

I tried the solution you have suggested but I got an exception because it is trying to populate the values in modal panel before calling action method. Infact it is not even calling the action method. I get this exception on the page.
type Exception report

message

description The server encountered an internal error () that prevented it from fulfilling this request.

exception

javax.servlet.ServletException: /pages/content.xhtml @140,57 value="#{ContentUI.detailedPackage.packageName}": Target Unreachable, 'detailedPackage' returned null
javax.faces.webapp.FacesServlet.service(FacesServlet.java:256)
org.ajax4jsf.webapp.BaseXMLFilter.doXmlFilter(BaseXMLFilter.java:141)
org.ajax4jsf.webapp.BaseFilter.doFilter(BaseFilter.java:281)
org.jboss.web.tomcat.filters.ReplyHeaderFilter.doFilter(ReplyHeaderFilter.java:96)


root cause

javax.el.PropertyNotFoundException: /pages/content.xhtml @140,57 value="#{ContentUI.detailedPackage.packageName}": Target Unreachable, 'detailedPackage' returned null
com.sun.facelets.el.TagValueExpression.getType(TagValueExpression.java:62)
com.sun.faces.renderkit.html_basic.HtmlBasicInputRenderer.getConvertedValue(HtmlBasicInputRenderer.java:81)
javax.faces.component.UIInput.getConvertedValue(UIInput.java:934)
javax.faces.component.UIInput.validate(UIInput.java:860)
javax.faces.component.UIInput.executeValidate(UIInput.java:1065)
javax.faces.component.UIInput.processValidators(UIInput.java:666)
javax.faces.component.UIForm.processValidators(UIForm.java:229)
javax.faces.component.UIComponentBase.processValidators(UIComponentBase.java:1033)
javax.faces.component.UIInput.processValidators(UIInput.java:664)
javax.faces.component.UIComponentBase.processValidators(UIComponentBase.java:1033)
javax.faces.component.UIForm.processValidators(UIForm.java:229)
javax.faces.component.UIComponentBase.processValidators(UIComponentBase.java:1033)
javax.faces.component.UIViewRoot.processValidators(UIViewRoot.java:662)
org.ajax4jsf.component.AjaxViewRoot.access$201(AjaxViewRoot.java:57)
org.ajax4jsf.component.AjaxViewRoot$3.invokeRoot(AjaxViewRoot.java:319)
org.ajax4jsf.context.JsfOneOneInvoker.invokeOnRegionOrRoot(JsfOneOneInvoker.java:56)
org.ajax4jsf.context.AjaxContextImpl.invokeOnRegionOrRoot(AjaxContextImpl.java:170)
org.ajax4jsf.component.AjaxViewRoot.processValidators(AjaxViewRoot.java:333)
com.sun.faces.lifecycle.ProcessValidationsPhase.execute(ProcessValidationsPhase.java:100)
com.sun.faces.lifecycle.LifecycleImpl.phase(LifecycleImpl.java:251)
com.sun.faces.lifecycle.LifecycleImpl.execute(LifecycleImpl.java:117)
javax.faces.webapp.FacesServlet.service(FacesServlet.java:244)
org.ajax4jsf.webapp.BaseXMLFilter.doXmlFilter(BaseXMLFilter.java:141)
org.ajax4jsf.webapp.BaseFilter.doFilter(BaseFilter.java:281)
org.jboss.web.tomcat.filters.ReplyHeaderFilter.doFilter(ReplyHeaderFilter.java:96)


note The full stack trace of the root cause is available in the JBossWeb/2.0.0.GA_CP01 logs


Thanks
--
Sushma

[mail.micke]

Hi

If you look in the cookbook example you can see that the content of the modal panel is wrapped inside a a4j:outputPanel with a rendered attribute. That makes sure that the content in the modal panel is only rendered if an object to display details from has been selected.

What I think is happening in your case is that the details object is null, but the content of the modal panel tries to access the properties of this null object.

You should do the same to your modal panel, and reRender that wrapped content when you select the object which details is to be displayed.

Hope this helps,
Mike

[sushma.w]

Mike,

I thought if i can send you the code you probably might understand how i am implementing. I have defined outputPanel in the modal panel like you have mentioned. But for some reason modal panel is trying to access a object which gets assigned when action is performed on the output link button.

<a4j:commandLink value="#{pkg.packageName}"
action="#{ContentUI.getSelectedPackageDetails}"
reRender="modalContent"
oncomplete="Richfaces.showModalPan('detailpanel'{width:450,top:200})">
<a4j:actionparam value="#{pkg.packageId}" assignTo="{ContentUI.selectedPkgId}"/>
</a4j:commandLink>
<rich:modalPanel id="detailpanel" minHeight="300" minWidth="450" height="300" width="500" zindex="2000">
<a4j:outputPanel id="modalContent" layout="inline">
<f:facet name="header">
<h:outputText value="Package Details {detailpackagename}" />
</f:facet>


Package Title:  

<h:inputText value="{ContentUI.detailedPackage.packageName}">
</h:inputText>



Package Type:  

<h:outputText value="#{ContentUI.detailedPackage.packageType}"/>




</a4j:outputPanel>
</rich:modalPanel>

[mail.micke]

Hi

I have never tried to wrap a facet in a output panel, that might not work, you may have to have a separate panels, an extra one to wrap the content of the header.

The problem is most likely that you don't have a "rendered" attribute on the wrapping outputPanel, that means that it will always try to render the content. But we only want the content of the modal panel to be rendered when there is a "detailsObject" selected (not null on the backing bean).

Try something like this on the wrapping outputPanel:
rendered="#{not empty ContentUI.detailedPackage}"

Cheers

[sushma.w]

Thanks mike, It worked. Panel was not rendering so i had to set output panel type value to none.

--
Sushma