Geek Answers Handbook

Ajax surface updates different panels according to backbean result

I am new to JSF, Primefaces and Ajax, so I try to update one panel if the check on my back bean is true and updates the other panel when it is false.

<h:panelGroup id="panel1">
    ...
    <h:commandButton id="btn1" action="#{bean.validate}">
        <p:ajax process="panel1" update="panel1"/>
    </h:commandButton>
</h:panelGroup>

<h:panelGroup id="panel2">
    ...
</h:panelGroup>

Back Bean:

public void validate() {
    ...
    if(validatecondition) {
        // Update panel 1
    } else {
        // update panel 2
    }
}

So can this be done using ajax? Thanks in advance!

+3
source share
3 answers

Of course, in two ways. Since you use simple fonts, the easiest two options are:

  • Use the RequestContext object to selectively refresh panels. Your code will look like this:

     public void validate() {
   RequestContext context = RequestContext.getCurrentInstance();
   if(validatecondition) {
     context.update("panel1");
   } else {
     context.update("panel2");
   }
}

  • JSF PartialViewContextcan do the same job just by typing a little

    FacesContext ctxt = FacesContext.getCurrentInstance(); //get your hands on the current request context
     if(validatecondition) {
         ctxt.getPartialViewContext().getRenderIds().add("panel1");
       } else {
         ctxt.getPartialViewContext().getRenderIds().add("panel2");
       }

getRenderIds() , JSF ajax . , RequestContext .

+8

, , PrimeFaces. "". :

<p:commandButton id="btn1" action="#{bean.validate}" process="panel1"/>

PrimeFaces AJAX, . ( bean).

bean:

public void validate() {
  // ...
  if(validatecondition) {
    RequestContext.getCurrentInstance().update("panel1");
  } else {
    RequestContext.getCurrentInstance().update("panel2");
  }
}

RequestContext - , reset JavaScript AJAX. 1 2.

+4

bean JSF, . 1 , 1, 2 2 .

JSF - , . , -. , bean.

<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.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">
    <h:head>
        <title>Facelet Title</title>
    </h:head>
    <h:body>
        Hello from Facelets
        <h:form id="frm" >

            <h:commandButton value="click me" action="#{test2.aa()}">                
                <f:ajax execute="@form" render=":mainpanel" ></f:ajax> 
            </h:commandButton>
            <h:inputText id="intest" value="#{test2.selection}"></h:inputText> 

        </h:form>
        <h:panelGroup id="mainpanel">
            <h:panelGroup id="panel1" rendered="#{test2.prop1=='v'}">panel1
                <h:outputLabel id="lbl1" value="#{test2.prop1}" ></h:outputLabel>                
            </h:panelGroup>
            <h:panelGroup id="panel2" rendered="#{test2.prop2=='v'}">panel2
                <h:outputLabel id="lbl2" value="#{test2.prop2}"></h:outputLabel>
            </h:panelGroup>
        </h:panelGroup>
    </h:body>
</html>

Simple bean code is as simple as possible. I also used the session scope in the query scope.

package test;

import javax.inject.Named;
import javax.enterprise.context.SessionScoped;
import java.io.Serializable;

@Named(value = "test2")
@SessionScoped
public class test2 implements Serializable {


    String prop1;
    String prop2;
    String selection;

    public String getProp1() {
        return prop1;
    }

    public void setProp1(String prop1) {
        this.prop1 = prop1;
    }

    public String getProp2() {
        return prop2;
    }

    public void setProp2(String prop2) {
        this.prop2 = prop2;
    }

    public test2() {
        prop1 = "v";
        prop2 = "v";
        selection = "";
    }

    public String getSelection() {
        return selection;
    }

    public void setSelection(String selection) {
        this.selection = selection;
    }

    public String aa() {
        if ("".equals(selection)) {
            prop1 = "v";
            prop2 = "v";
            return "";
        } else if ("1".equals(selection)) {
            prop1 = "v";
            prop2 = "h";
            return "";
        } else if ("2".equals(selection)) {
            prop1 = "h";
            prop2 = "v";
            return "";
        }
        return "";
    }
}
0
source

More articles:


All Articles