[SOLVED] Portlet : Submit form with JSF2

[Eric Toto, modificado 9 Anos atrás.]

Hi everybody.

I am new with Liferay Development, and I am facing an issue with the development of a simple portlet.

I am using Ligferay 6.2.2 + JSF 2 with Primefaces.

What I would like to do :
I have a simple form containing only a select menu. I would like to submit the selected value On Change and reload the page. But despite many trials/tutorials during hours, the target method on the bean is not called.

Thanks for any advice

Here is my code :

view.xhtml

<!--?xml version="1.0"?-->

<f:view xmlns="http://www.w3.org/1999/xhtml" xmlns:c="http://java.sun.com/jsp/jstl/core" xmlns:f="http://java.sun.com/jsf/core" xmlns:h="http://java.sun.com/jsf/html" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:p="http://primefaces.org/ui">
	<h:head />
	<h:body>
		<h2>Ma Portlet Meteo</h2>



		<p>
			Votre ville actuelle :
			<h:outputtext value="#{beanMeteo.userVille}" style="font-weight:bold" />
		</p>
		<h:form>
			<p>
				Sélectionner une autre ville :
				<h:selectonemenu value="#{beanMeteo.userVille}" valuechangelistener="#{beanMeteo.setUserVille}" onchange="submit()">


					<f:selectitems value="#{beanMeteo.lesVilles}" var="v" itemValue="#{v.id}" itemLabel="#{v.nom}" />
				</h:selectonemenu>
			</p>
		</h:form>


	</h:body>
</f:view>

BeanMeteo.java

package com.eric.test;

import com.liferay.faces.util.portal.WebKeys;
import com.liferay.portal.model.User;
import com.liferay.portal.theme.ThemeDisplay;

import java.io.Serializable;
import java.util.ArrayList;

import javax.faces.application.FacesMessage;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.RequestScoped;
import javax.faces.context.FacesContext;
import javax.faces.event.AjaxBehaviorEvent;
import javax.faces.event.ValueChangeEvent;
import javax.portlet.PortletRequest;

import org.primefaces.event.SelectEvent;

@ManagedBean
@RequestScoped
public class BeanMeteo implements Serializable {

	private ArrayList<beanville> lesVilles = null;
	private BeanVille UserVille = new BeanVille("FRXX0274", "Saint-Etienne");

	public ArrayList<beanville> getLesVilles() {

		if (this.lesVilles == null) {

			this.lesVilles = new ArrayList<beanville>();

			this.lesVilles.add(new BeanVille("FRXX0017", "Bourg-en-Bresse"));
			this.lesVilles.add(new BeanVille("FRXX0211", "Digne-les-Bains"));
			this.lesVilles.add(new BeanVille("FRXX0206", "Laon"));
			this.lesVilles.add(new BeanVille("FRXX0408", "Moulins"));
			this.lesVilles.add(new BeanVille("FRXX0073", "Nice"));
			this.lesVilles.add(new BeanVille("FRXX0165", "Nîmes"));
			this.lesVilles.add(new BeanVille("FRXX0076", "Paris"));
			this.lesVilles.add(new BeanVille("FRXX0274", "Saint-Etienne"));
		}

		return lesVilles;
	}

	public String getUserVille() {

		User currentUser = this.getUser();
		if (currentUser != null) {
			String laVilleEntregistree = (String) currentUser.getExpandoBridge().getAttribute("Ville");
			if (!laVilleEntregistree.contentEquals("")) {
				return this.chercheVille(laVilleEntregistree).getId();
			}
		}

		return this.UserVille.getId();
	}

	private User getUser() {
		User user = null;
		FacesContext facesContext = FacesContext.getCurrentInstance();
		PortletRequest portletRequest = (PortletRequest) facesContext.getExternalContext().getRequest();

		ThemeDisplay td = (ThemeDisplay) portletRequest.getAttribute(WebKeys.THEME_DISPLAY);
		user = td.getUser();

		return user;
	}

	public void setUserVille(ValueChangeEvent event) {
		
		System.out.println("--------------------------&gt;");
		
		String lUserVille = "FRXX0274";
		this.UserVille = chercheVille(lUserVille);
		this.getUser().getExpandoBridge().setAttribute("Ville", lUserVille);
		
	}

	private BeanVille chercheVille(String Id) {

		for (BeanVille laVille : this.getLesVilles()) {
			if (laVille.getId().contentEquals(Id)) {
				return laVille;
			}
		}

		return this.UserVille;

	}


}
</beanville></beanville></beanville>

[Juan Gonzalez, modificado 9 Anos atrás.]

Hi Eric,

whenever you change that value, can you see if form is actually sent?

Can you try changing "onchange" to "onclick" to see if that works for you?

There is other approach using AJAX:

 <f:ajax event="click" .. />

nested to your <h:select...>. In this case you have to remove "onchange" attribute.

[Eric Toto, modificado 9 Anos atrás.]

Hi Juan, thanks for your reply.

None of them works.
On Internet I saw two possible ways
- With an action listener
- With Ajax

No results

Here is my target method :

public void setUserVille(AjaxBehaviorEvent event) {
		System.out.println("--------------------------> Nouvelle Ville!!!");
	}

[Juan Gonzalez, modificado 9 Anos atrás.]

Hi Eric,

how did you create your portlet? Did you use Liferay IDE wizard or the existing Liferay Faces archetype?

Can you check if you have:

<requires-namespaced-parameters>false</requires-namespaced-parameters>

in liferay-portlet-xml as in this example?

https://github.com/liferay/liferay-faces/blob/3.2.4-ga5/demos/bridge/jsf2-portlet/src/main/webapp/WEB-INF/liferay-portlet.xml#L10

[Eric Toto, modificado 9 Anos atrás.]

I created the portlet with the Liferay Studio Wizard : New plugin project then new portlet...

Here is the content of my liferay-portlet.xml :

<!--?xml version="1.0"?-->


<liferay-portlet-app>
	<portlet>
		<portlet-name>1</portlet-name>
		<instanceable>true</instanceable>
		<remoteable>true</remoteable>
		<requires-namespaced-parameters>false</requires-namespaced-parameters>
		<ajaxable>true</ajaxable>
	</portlet>
	<role-mapper>
		<role-name>administrator</role-name>
		<role-link>Administrator</role-link>
	</role-mapper>
	<role-mapper>
		<role-name>guest</role-name>
		<role-link>Guest</role-link>
	</role-mapper>
	<role-mapper>
		<role-name>power-user</role-name>
		<role-link>Power User</role-link>
	</role-mapper>
	<role-mapper>
		<role-name>user</role-name>
		<role-link>User</role-link>
	</role-mapper>
</liferay-portlet-app>

[Eric Toto, modificado 9 Anos atrás.]

Problem solved. A kind of work-around.

I had to remove the called method and let JSF do it by itself, ie calling the setter method of the field.

<h:form>
			<p>
				Sélectionner une autre ville :
				<h:selectonemenu value="#{beanMeteo.userVille}" onchange="submit()">
					<f:selectitems value="#{beanMeteo.lesVilles}" var="v" itemValue="#{v.id}" itemLabel="#{v.nom}" />
				</h:selectonemenu>
			</p>
		</h:form>

[andreas kehl, modificado 9 Anos atrás.]

Give it another try as
with ajaxEvent updates are possible to certain regions on the page:

following works for me
<h:outputText id="numberTypeTypeId" styleClass="dialogLabel"
value="#{portletMsg.number_type}" />
<h:selectOneMenu id="numberTypeSelectOneMenueId"
value="#{RfsHistory.numberType}">
<p:ajax listener="#{RfsHistory.ajaxNumberTypeChanged}"
update="@form" />
<f:selectItems value="#{RfsHistory.numberTypeItems}" />
</h:selectOneMenu>

Backing Bean
public void ajaxNumberTypeChanged(final AjaxBehaviorEvent ajaxBehaviorEvent)
{
LOGGER.debug("ajaxNumberTypeChanged");
// need to know / detect correct class of component
final HtmlSelectOneMenu _component = (HtmlSelectOneMenu)ajaxBehaviorEvent.getComponent();

// need to know / detect correct Class of Value
final Integer _valueObj = (Integer)_component.getValue();

this.numberType = _valueObj ;
}

[Juan Gonzalez, modificado 9 Anos atrás.]

Moved to Liferay Faces category