CODEWITHSUNDEEP
jsfprimefaces
user3725627
user3725627

Reputation: 5

JSF Hide and show

I am new to JSF as well as stack overflow, I want to hide and show the components according to the button click. If button clicked then component should be visible and next time it should be invisible and so on. I tried below program

My jsg page

       <p:commandButton value="submit" action="#{exampleBean.hideOrShow}"
                        update=":test" />
       <h:inputText value="#{exampleBean.hidden}"/>
       <h:inputText value="#{exampleBean.i}"/>
       <h:panelGroup layout="block" rendered="#{exampleBean.hidden}">
            <div>

                Hello,<h:inputText value="hi"/>
                testing,<h:inputText />
                addr:<h:inputText/>
                </div>

        </h:panelGroup> 
   </h:form>

and

My bean

public void hideOrShow(){

 if (!hidden)
 {
    i++; 
    hidden=true;
 }
 else
 {
    i++; 
    hidden=false;
 }





   }
/**
 * @return the hidden
 */
public boolean isHidden() {
    return hidden;
}

/**
 * @param hidden the hidden to set
 */
public void setHidden(boolean hidden) {
    this.hidden = hidden;
}

/**
 * @return the i
 */
public int getI() {
    return i;
}

/**
 * @param i the i to set
 */
public void setI(int i) {
    this.i = i;
}
}

NOTE:for first two click it working properly then it is not working.

Thanks in Advance

Upvotes: 0

Views: 11595

Answers (2)

Adheep
Adheep

Reputation: 1585

You can try accomplishing using AJAX instead of form submit. You can use f:ajax and change toggle the member variable hidden value and use render attribute to update the panelGroup

Here is something you could try

<p:commandButton value="submit">
  <f:ajax listener="#{exampleBean.hideOrShow}" event="click" render="panel1"></f:ajax>
</p:commandButton>

And add a 'id' attribute in your panelGroup

<h:panelGroup layout="block" rendered="#{exampleBean.hidden}" id="panel1">
            <div>

                Hello,<h:inputText value="hi"/>
                testing,<h:inputText />
                addr:<h:inputText/>
                </div>
</h:panelGroup>

Hope it helps!

Note: Since the start of your form tag not visible, just be aware that if you have id for your <h:form> tag, then you need to append it in render attribute

Upvotes: 3

Szarpul
Szarpul

Reputation: 1571

The 'update' attribute referes to the id on your page, so you have to declare it. Remember that you can not update elements that have 'rendered' attribute. More info here

Also consider using BooleanCheckBox

Upvotes: 0

Related Questions