0

im relatively new to HTML/Javascript/Java and so far i found a solution for all my "beginner" problems... But this already took me some hours of "try and error": In my application the client fills out a form which is then transmitted via submit button to the server bean.

The problem is, that the p:commandButton (marked in the code below) does not execute the method expression from actionListener. Executing javascript code in the oncomplete or onsuccess property works, but since i want to invoke a backed bean method after the form submission i think the actionListener property would be the right choice.. if it worked. It is maybe important to mention, that the form is inside a primefaces dialog window.

Just let me know if you need maybe more information like javascript- or java code..

Does someone know what the problem is? Thanks in advance.

Heres some code to illustrate my Problem..

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:p="http://primefaces.org/ui">

    <h:head>
        <f:facet name="first">
            <meta content='text/html; charset=UTF-8' http-equiv="Content-Type"/>
            <title>Title</title>
        </f:facet>

        <style>

        </style>
    </h:head>

    <script src="https://maps.googleapis.com/maps/api/js?v=3.exp"></script>
    <script>

    </script>

    <h:body id="body">

        <p:growl id="growl" showDetail="true" />

        <p:layout fullPage="true">

            <p:layoutUnit position="north" size="100" resizable="true" closable="true" collapsible="true">
                Ihre Aufgabe besteht darin, 5 Ladesäulen zu setzten wo es ihnen gefällt auf der Karte.
            </p:layoutUnit>

            <p:layoutUnit position="south" size="175">                
                    <h:outputLabel id="outp" value="#{mainController.testparam}" />
            </p:layoutUnit>

            <p:layoutUnit position="west" size="175" collapsible="true">

            </p:layoutUnit>

            <p:layoutUnit position="center" id='idcenter'>

                <div id="map-canvas"></div>   

                <p:dialog id="dlg" modal="true" closeOnEscape="false" fitViewport="true" widgetVar="dlg" closable="false" resizable="false" width="50%" minWidth="500" appendTo="body">
                    <!--><h:form prependId="false" onsubmit="return cancel()"><-->

                    <h:form prependId="false" id="form1">                        
                        <h:panelGrid columns="3" cellpadding="10">
                            <h:outputLabel for="xfield" value="Koordinaten" />
                            <h:inputText disabled="true" id="xfield" value="#{mainController.currentXCoordinate}"/>
                            <h:inputText disabled="true" id="yfield" value="#{mainController.currentYCoordinate}"/>


                            <h:outputLabel for="location" value="Abfrage: PositionDescription" />
                            <p:inputTextarea id="descriptionPosition" autoResize="true" class="textinput" required="false" counter="display1" maxlength="1000" value="#{mainController.currentPositionDescription}" counterTemplate="{0} Zeichen übrig"/>
                            <h:outputText id="display1" class="display"/>
                            <h:outputText value="#{mainController.currentPositionDescription}" rendered="false"/>

                            <h:outputLabel for="reason" value="Abfrage: Reason" />
                            <p:inputTextarea id="reason" autoResize="true" class="textinput" required="false" counter="display2" maxlength="250" value="#{mainController.currentReason}" counterTemplate="{0} Zeichen übrig"/>
                            <h:outputText id="display2" class="display"/>
                            <h:outputText value="#{mainController.currentReason}" rendered="false"/>


                            <h:outputLabel for="ratingImportance" value="Abfrage: Rating Importance" />
                            <p:selectOneMenu id="ratingImportance" value="#{mainController.currentRatingImportance}" required="false">
                                <f:selectItem itemLabel="Rating Importance" itemValue="0" />
                                <f:selectItem itemLabel="Sehr wichtig" itemValue="4" />
                                <f:selectItem itemLabel="Wichtig" itemValue="3" />
                                <f:selectItem itemLabel="Eher unwichtig" itemValue="2" />
                                <f:selectItem itemLabel="Unwichtig" itemValue="1" />
                            </p:selectOneMenu>
                            <h:outputText value="#{mainController.currentRatingImportance}" rendered="true"/>

                            <h:outputLabel for="numberOfChargingPoints" value="Abfrage: NumberOfChargingPoints" />
                            <p:selectOneMenu id="numberOfChargingPoints" value="#{mainController.currentNumberOfChargingPoints}" required="false">
                                <f:selectItem itemLabel="1" itemValue="1" />
                                <f:selectItem itemLabel="2" itemValue="2" />
                                <f:selectItem itemLabel="3" itemValue="3" />
                                <f:selectItem itemLabel="4" itemValue="4" />
                            </p:selectOneMenu>
                            <h:outputText value="#{mainController.currentNumberOfChargingPoints}" rendered="true"/>

                            <h:outputLabel for="chargingStandard" value="Abfrage: Charging Standard" />
                            <p:selectOneMenu id="chargingStandard" value="#{mainController.currentChargingStandard}" required="false">
                                <f:selectItem itemLabel="ChaDeMo" itemValue="ChaDeMo" />
                                <f:selectItem itemLabel="CCS" itemValue="CCS" />
                                <f:selectItem itemLabel="Typ3" itemValue="Typ3" />
                                <f:selectItem itemLabel="Typ2" itemValue="Typ2" />
                                <f:selectItem itemLabel="HPC" itemValue="HPC" />
                                <f:selectItem itemLabel="keine Angabe" itemValue="ka" />
                            </p:selectOneMenu>
                            <h:outputText value="" rendered="true"/>

                            <h:outputLabel for="rating1" value="Abfrage: Rating 1" />
                            <p:inputTextarea id="rating1" class="textinput" required="false" counter="display3" maxlength="250" value="#{mainController.currentRating1}" counterTemplate="Noch {0} Zeichen"/>
                            <h:outputText id="display3" class="display"/>
                            <h:outputText value="#{mainController.currentRating1}" rendered="false"/>

                            <h:outputLabel for="rating2" value="Abfrage: Rating 2" />
                            <p:inputTextarea id="rating2" class="textinput" required="false" counter="display4" maxlength="250" value="#{mainController.currentRating2}" counterTemplate="Noch {0} Zeichen"/>
                            <h:outputText id="display4" class="display"/>
                            <h:outputText value="#{mainController.currentRating2}" rendered="false"/>

                            <h:outputLabel for="rating3" value="Abfrage: Rating 3" />
                            <p:inputTextarea id="rating3" class="textinput" required="false" counter="display5" maxlength="250" value="#{mainController.currentRating3}" counterTemplate="Noch {0} Zeichen"/>
                            <h:outputText id="display5" class="display"/>
                            <h:outputText value="#{mainController.currentRating3}" rendered="false"/>

                            <!-->This commandbutton does not execute the methodExpression<-->
                            <p:commandButton value="Submit" update="form1" icon="ui-icon-check" rendered="true" id="button1" actionListener="#{mainController.saveData}"/>
                            <p:commandButton type="reset" value="Cancel" onclick="return cancel()"/>
                        </h:panelGrid>
                        <h:inputHidden value="#{mainController.currentId}" />

                    </h:form>

                </p:dialog >   
            </p:layoutUnit>

        </p:layout>

    </h:body>


</html>
Tiny
  • 27,221
  • 105
  • 339
  • 599
joarhem
  • 1
  • 2
  • I don't see anything wrong directly, but I cannot asses it completely. Can you create an [mcve](http://stackoverflow.com/help/mcve)? So reducing the xhtml to the bare minimum and also post the relevant bean (but also the minumum) – Kukeltje Jan 30 '15 at 15:11
  • What JSF/PF version are you using? appendTo="body" looks wrong to me, should probably be appendTo="@(body)", but dont know if will solve – Jaqen H'ghar Jan 30 '15 at 21:18
  • Hi Jaqen, this was my workaround on the problem that the opening dialog was also blured out with the background window. The non-primefaces solution was to set appendToBody="true" but this attribute is obsolescent in the primefaces dialog.. As works also with your solution, which seems cleaner to me, i changed it... thanks – joarhem Feb 02 '15 at 12:49
  • thanks @BalusC for showing me the link to the thread where my question was already addressed.. Looking into to bulletpoint 5 in the thread solved my problem. I had some components in the form which were set as rendered="false" and also 2 inputtexts which were set to disabled="true". My understanding of the form submission procedure is still not good enough to understand why this prevented the commandbutton to execute the actionlistener, can someone explain that? – joarhem Feb 02 '15 at 12:56
  • Safeguard against hackers who manipulate the HTTP request to simulate an enabled/rendered button or input. – BalusC Feb 02 '15 at 13:09

1 Answers1

1

I found two problems in your code.

  1. You should use styleClass attribute, which is a Style class of the container element, instead of class.
  2. The location id cannot find in your xhtml code.

Since, you did not post your managed bean, I cannot specify your problem. However,I try to create managedbean by myself as following. It's work fine.

xhtml

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:p="http://primefaces.org/ui">

    <h:head>
        <f:facet name="first">
            <meta content='text/html; charset=UTF-8' http-equiv="Content-Type"/>
            <title>Title</title>
        </f:facet>

        <style>

        </style>
    </h:head>

    <script src="https://maps.googleapis.com/maps/api/js?v=3.exp"></script>
    <script>

    </script>

    <h:body id="body">

        <p:growl id="growl" showDetail="true" />

        <p:layout fullPage="true">

            <p:layoutUnit position="north" size="100" resizable="true" closable="true" collapsible="true">
                Ihre Aufgabe besteht darin, 5 Ladesäulen zu setzten wo es ihnen gefällt auf der Karte.
            </p:layoutUnit>

            <p:layoutUnit position="south" size="175">                
                <h:outputLabel id="outp" value="#{mainController.testparam}" />
            </p:layoutUnit>

            <p:layoutUnit position="west" size="175" collapsible="true">

            </p:layoutUnit>

            <p:layoutUnit position="center" id='idcenter'>

                <div id="map-canvas"></div>   
                <p:commandButton value="Basic" type="button" onclick="PF('dlg').show();" />
                <p:dialog id="dlg" modal="true" closeOnEscape="false" 
                          fitViewport="true" widgetVar="dlg" 
                          closable="false" resizable="false" 
                          width="50%" minWidth="500" appendTo="body">
                    <!--><h:form prependId="false" onsubmit="return cancel()"><-->

                    <h:form prependId="false" id="form1">                        
                        <h:panelGrid columns="3" cellpadding="10">
                            <h:outputLabel for="xfield" value="Koordinaten" />
                            <h:inputText disabled="true" id="xfield" 
                                         value="#{mainController.currentXCoordinate}"/>
                            <h:inputText disabled="true" id="yfield" 
                                         value="#{mainController.currentYCoordinate}"/>


                            <h:outputLabel for="descriptionPosition" 
                                           value="Abfrage: PositionDescription" />
                            <p:inputTextarea id="descriptionPosition" 
                                             autoResize="true" styleClass="textinput" 
                                             required="false" counter="display1" 
                                             maxlength="1000" 
                                             value="#{mainController.currentPositionDescription}" 
                                             counterTemplate="{0} Zeichen übrig"/>
                            <h:outputText id="display1" styleClass="display"/>
                            <h:outputText value="#{mainController.currentPositionDescription}" 
                                          rendered="false"/>

                            <h:outputLabel for="reason" value="Abfrage: Reason" />
                            <p:inputTextarea id="reason" autoResize="true" styleClass="textinput" 
                                             required="false" counter="display2" maxlength="250" 
                                             value="#{mainController.currentReason}" 
                                             counterTemplate="{0} Zeichen übrig"/>
                            <h:outputText id="display2" styleClass="display"/>
                            <h:outputText value="#{mainController.currentReason}" 
                                          rendered="false"/>


                            <h:outputLabel for="ratingImportance" 
                                           value="Abfrage: Rating Importance" />
                            <p:selectOneMenu id="ratingImportance" 
                                             value="#{mainController.currentRatingImportance}" 
                                             required="false">
                                <f:selectItem itemLabel="Rating Importance" itemValue="0" />
                                <f:selectItem itemLabel="Sehr wichtig" itemValue="4" />
                                <f:selectItem itemLabel="Wichtig" itemValue="3" />
                                <f:selectItem itemLabel="Eher unwichtig" itemValue="2" />
                                <f:selectItem itemLabel="Unwichtig" itemValue="1" />
                            </p:selectOneMenu>
                            <h:outputText value="#{mainController.currentRatingImportance}" 
                                          rendered="true"/>

                            <h:outputLabel for="numberOfChargingPoints" 
                                           value="Abfrage: NumberOfChargingPoints" />
                            <p:selectOneMenu id="numberOfChargingPoints" 
                                             value="#{mainController.currentNumberOfChargingPoints}" 
                                             required="false">
                                <f:selectItem itemLabel="1" itemValue="1" />
                                <f:selectItem itemLabel="2" itemValue="2" />
                                <f:selectItem itemLabel="3" itemValue="3" />
                                <f:selectItem itemLabel="4" itemValue="4" />
                            </p:selectOneMenu>
                            <h:outputText value="#{mainController.currentNumberOfChargingPoints}" 
                                          rendered="true"/>

                            <h:outputLabel for="chargingStandard" 
                                           value="Abfrage: Charging Standard" />
                            <p:selectOneMenu id="chargingStandard" 
                                             value="#{mainController.currentChargingStandard}" 
                                             required="false">
                                <f:selectItem itemLabel="ChaDeMo" itemValue="ChaDeMo" />
                                <f:selectItem itemLabel="CCS" itemValue="CCS" />
                                <f:selectItem itemLabel="Typ3" itemValue="Typ3" />
                                <f:selectItem itemLabel="Typ2" itemValue="Typ2" />
                                <f:selectItem itemLabel="HPC" itemValue="HPC" />
                                <f:selectItem itemLabel="keine Angabe" itemValue="ka" />
                            </p:selectOneMenu>
                            <h:outputText value="" rendered="true"/>

                            <h:outputLabel for="rating1" value="Abfrage: Rating 1" />
                            <p:inputTextarea id="rating1" styleClass="textinput" 
                                             required="false" counter="display3" 
                                             maxlength="250" value="#{mainController.currentRating1}" 
                                             counterTemplate="Noch {0} Zeichen"/>
                            <h:outputText id="display3" styleClass="display"/>
                            <h:outputText value="#{mainController.currentRating1}" 
                                          rendered="false"/>

                            <h:outputLabel for="rating2" value="Abfrage: Rating 2" />
                            <p:inputTextarea id="rating2" styleClass="textinput" 
                                             required="false" counter="display4" 
                                             maxlength="250" value="#{mainController.currentRating2}" 
                                             counterTemplate="Noch {0} Zeichen"/>
                            <h:outputText id="display4" styleClass="display"/>
                            <h:outputText value="#{mainController.currentRating2}" 
                                          rendered="false"/>

                            <h:outputLabel for="rating3" value="Abfrage: Rating 3" />
                            <p:inputTextarea id="rating3" styleClass="textinput" 
                                             required="false" counter="display5" 
                                             maxlength="250" value="#{mainController.currentRating3}" 
                                             counterTemplate="Noch {0} Zeichen"/>
                            <h:outputText id="display5" styleClass="display"/>
                            <h:outputText value="#{mainController.currentRating3}" rendered="false"/>

                            <!-->This commandbutton does not execute the methodExpression<-->
                            <p:commandButton value="Submit" update="@form" icon="ui-icon-check" 
                                             rendered="true" id="button1" 
                                             actionListener="#{mainController.saveData}"/>
                            <p:commandButton type="reset" value="Cancel" 
                                             onclick="return cancel()"/>
                        </h:panelGrid>
                        <h:inputHidden value="#{mainController.currentId}" />

                    </h:form>

                </p:dialog >   
            </p:layoutUnit>

        </p:layout>
    </h:body>
</html>

managedbeam

/*
 * To change this license header, choose License Headers in Project Properties.
 * To change this template file, choose Tools | Templates
 * and open the template in the editor.
 */

package com.sample.view;

import java.io.Serializable;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.ViewScoped;
import javax.faces.event.ActionEvent;

/**
 *
 * @author Wittakarn
 */
@ViewScoped
@ManagedBean(name = "mainController")
public class MainController implements Serializable {
    private String testparam;
    private String currentXCoordinate;
    private String currentYCoordinate;
    private String currentPositionDescription;
    private String currentReason;
    private String currentRatingImportance;
    private String currentNumberOfChargingPoints;
    private String currentChargingStandard;
    private String currentRating1;
    private String currentRating2;
    private String currentRating3;
    private String currentId;

    public MainController(){}

    public String getTestparam() {
        return testparam;
    }

    public void setTestparam(String testparam) {
        this.testparam = testparam;
    }

    public String getCurrentXCoordinate() {
        return currentXCoordinate;
    }

    public void setCurrentXCoordinate(String currentXCoordinate) {
        this.currentXCoordinate = currentXCoordinate;
    }

    public String getCurrentYCoordinate() {
        return currentYCoordinate;
    }

    public void setCurrentYCoordinate(String currentYCoordinate) {
        this.currentYCoordinate = currentYCoordinate;
    }

    public String getCurrentPositionDescription() {
        return currentPositionDescription;
    }

    public void setCurrentPositionDescription(String currentPositionDescription) {
        this.currentPositionDescription = currentPositionDescription;
    }

    public String getCurrentReason() {
        return currentReason;
    }

    public void setCurrentReason(String currentReason) {
        this.currentReason = currentReason;
    }

    public String getCurrentRatingImportance() {
        return currentRatingImportance;
    }

    public void setCurrentRatingImportance(String currentRatingImportance) {
        this.currentRatingImportance = currentRatingImportance;
    }

    public String getCurrentNumberOfChargingPoints() {
        return currentNumberOfChargingPoints;
    }

    public void setCurrentNumberOfChargingPoints(String currentNumberOfChargingPoints) {
        this.currentNumberOfChargingPoints = currentNumberOfChargingPoints;
    }

    public String getCurrentChargingStandard() {
        return currentChargingStandard;
    }

    public void setCurrentChargingStandard(String currentChargingStandard) {
        this.currentChargingStandard = currentChargingStandard;
    }

    public String getCurrentRating1() {
        return currentRating1;
    }

    public void setCurrentRating1(String currentRating1) {
        this.currentRating1 = currentRating1;
    }

    public String getCurrentRating2() {
        return currentRating2;
    }

    public void setCurrentRating2(String currentRating2) {
        this.currentRating2 = currentRating2;
    }

    public String getCurrentRating3() {
        return currentRating3;
    }

    public void setCurrentRating3(String currentRating3) {
        this.currentRating3 = currentRating3;
    }

    public String getCurrentId() {
        return currentId;
    }

    public void setCurrentId(String currentId) {
        this.currentId = currentId;
    }

    public void saveData(ActionEvent event){
        System.out.println("saveData");
    }
}
wittakarn
  • 3,124
  • 1
  • 18
  • 31
  • Hey @wittakarn, thanks for the advice with the "class" attribute, i will change that. And i deleted the location id, that was an artifact of some previous try and error which i forgot, surprisingly it did not influence anything. I did not post the bean, because as you just proved by reconstructiing it :), it is a trivial bean of which im sure that its not faulty... – joarhem Feb 02 '15 at 10:06