2

Hope you could help me I am learning JSF and Primesface on my own. I having trouble implementing the following JSF form, and make it work as I require it

Basically

I need to have one Form, and need to execute AJAX whenever a value change in the Form. I am not able to make that Once Single Ajax call call for entrie form. Rather I have to call it for every Data Input I have to call. Second the Date Picker does not work or loses it formatting after selecting date. Note I have not any additional Java Script... to the JSF.
Please refer additional image that I have attached

Further is that Possible to provide Single Ajax in case any inputs changes in the FORM, instead of each inputs tags.

What is difference between f:ajax and p:ajax

JSF 2.3 Dynamic Web Module 4.0 Redhat JBOSS 7.2 Java 1.8 Primefaces 7.0

<html xmlns="http://www.w3.org/1999/xhtml" 
    xmlns:h="http://xmlns.jcp.org/jsf/html" 
            xmlns:f="http://xmlns.jcp.org/jsf/core" 
                    xmlns:ui="http://xmlns.jcp.org/jsf/facelets" 
                            xmlns:p="http://primefaces.org/ui">
                        <h:form styleClass="fill"  id="tinputForm">
                            <div style="color: #FFF; padding-left: 70px"><strong >INPUT PANEL</strong></div>
                            <hr/>
                            <h:panelGroup layout="block"  styleClass="CustomWell" >
                                <h:outputLabel value="Server-Class"/>

                                <h:panelGroup  layout="block" styleClass="radio">
                                    <h:selectOneRadio value = "#{sideBarInputsBean.serverClass}" layout="pageDirection" >
                                        <f:selectItem itemValue = "Gateway" itemLabel = "Gateway"  />
                                        <f:selectItem itemValue = "Facing Server" itemLabel = "Facing Server" />
                                        <f:selectItem itemValue = "Server Facing" itemLabel = "Server Facing" />
                                        <f:selectItem itemValue = "Central Server" itemLabel = "Central Server" />
                                        <!-- <p:ajax listener="#{sideBarInputsBean.printSelectedCRadioButton()}" />  -->

                                        <f:ajax event="click" listener="#{sideBarInputsBean.printSelectedCRadioButton()}" execute="@form" render="@form :tinputForm" />
                                    </h:selectOneRadio>    
                                </h:panelGroup>
                            </h:panelGroup>

                            <h:panelGroup layout="block"  styleClass="CustomWell" >

                                <h:outputLabel value="Choose a Parameter:"/>

                                <h:panelGroup  layout="block" styleClass="radio">
                                    <h:selectOneRadio  value = "#{sideBarInputsBean.parameter}" layout="pageDirection" >
                                        <f:selectItem itemValue = "IISLOG"  itemLabel = "IIS Log Counter"  />
                                        <f:selectItem itemValue = "ASPNET" itemLabel = "ASP DOT Net Counters" />
                                    </h:selectOneRadio>    
                                </h:panelGroup>
                            </h:panelGroup>

                            <h:panelGroup layout="block"  styleClass="CustomWell" >
                                <h:outputLabel value="Select a Server:"/>
                                <h:panelGroup rendered="#{sideBarInputsBean.serverClass == 'Gateway'}">
                                    <h:panelGroup layout="block" >
                                        <h:selectOneMenu  id="CLGWServer" value="#{sideBarInputsBean.serverName}" styleClass="mymenu">
                                            <f:selectItem itemLabel="Select One" itemValue="" />
                                            <f:selectItems value="#{dataForSideBarInputBean.clientGatewayList}" />
                                        <f:ajax event="change" listener="#{sideBarInputsBean.printSelectedCRadioButton()}" execute="@form"  render="@form :tinputForm" />
                                        </h:selectOneMenu>
                                    </h:panelGroup>
                                </h:panelGroup>

                                <h:panelGroup rendered="#{sideBarInputsBean.serverClass == 'Facing Server'}">
                                    <h:panelGroup layout="block" >
                                        <h:selectOneMenu id="CFASServer" value="#{sideBarInputsBean.serverName}" styleClass="mymenu">
                                            <f:selectItem itemLabel="Select One" itemValue="" />
                                            <f:selectItems value="#{dataForSideBarInputBean.clientFacingList}" />
                                        <f:ajax event="change" listener="#{sideBarInputsBean.printSelectedCRadioButton()}"  execute="@form" render="@form :tinputForm" />
                                        </h:selectOneMenu>
                                    </h:panelGroup>
                                </h:panelGroup>
                                </h:panelGroup>



                                <h:panelGroup layout="block"  styleClass="CustomWell" >
                                    <h:panelGroup layout="block" styleClass="datepick">
                                        <p:outputLabel value="Date:" />
                                        <p:datePicker  id="DateSelector" value="#{sideBarInputsBean.selectedDate}" showIcon="true" showTime="true" pattern="dd.MM.yyyy">
                                            <f:ajax event="dateSelect" listener="#{sideBarInputsBean.printSelectedCRadioButton()}" execute="@form" render="@form :tinputForm" />
                                        </p:datePicker>
                                    </h:panelGroup>
                                </h:panelGroup>



                        </h:form>

Bean Code.

package cdv.mrdataanalytics.bean;

import java.io.IOException;
import java.io.Serializable;
import java.util.ArrayList;
import java.util.Date;
import java.util.List;

import javax.enterprise.context.SessionScoped;
import javax.faces.context.ExternalContext;
import javax.faces.context.FacesContext;
import javax.inject.Named;



@Named("sideBarInputsBean")
@SessionScoped

public class SideBarInputsBean implements Serializable {


    private static final long serialVersionUID = 1L;

    private String serverClass="Gateway";
    private String parameter="IISLOG";
    private String serverName="";

    private Date selectedDate;

    public String getServerClass() {
        return this.serverClass;
    }

    public void setServerClass(String strClass) {
        this.serverClass = strClass;
    }

    public String getParameter() {
        return this.parameter;
    }

    public void setParameter(String strClass) {
        this.parameter = strClass;
    }

    public String getServerName() {
        return this.serverName;
    }

    public void setServerName(String strClass) {
        this.serverName = strClass;
    }

    public Date getSelectedDate() {
        return this.selectedDate;
    }

    public void setSelectedDate(Date date7) {
        this.selectedDate = date7;
    }

    public void printSelectedCRadioButton() throws IOException{
        System.out.println("Selected value = "+this.getServerClass());
        System.out.println("Parameter value = "+this.getParameter());
        System.out.println("ServerName = "+this.getServerName());
        System.out.println("SelectedDate = "+this.getSelectedDate());

        //ExternalContext ec = FacesContext.getCurrentInstance().getExternalContext();
        //ec.redirect(ec.getRequestContextPath() + "/next.xhtml?action=add");
    }

}

enter image description here

Jasper de Vries
  • 19,370
  • 6
  • 64
  • 102
  • Did you read https://stackoverflow.com/questions/25339056/understanding-primefaces-process-update-and-jsf-fajax-execute-render-attributes ? – Jasper de Vries Mar 02 '20 at 11:45
  • see [pf basic events](https://www.primefaces.org/showcase/ui/ajax/event.xhtml) and also see [this question](https://stackoverflow.com/questions/11586779/list-of-pajax-events) – fuggerjaki61 Mar 02 '20 at 15:01
  • Thanks you. I had found out the Issue. The Date Field Loose Formating because, it has the showTime=true, am not sure why it causing that issue... for now I have remove ShowTime=true and everything seems fine... However in the Discussion I cannot find How could I have a ONE F:ajax for Entire form, further I am also Looking for options to Update "PanelGroup with ID CLGWServer and CFASServer update, when ever the SelectOneRadio Option changes.... – Duraivelanc Chockalingam Mar 03 '20 at 22:45

0 Answers0