Boolean checkbox, set value of textfield

2018-06-24 11:15:09

I'm trying to create a form where you can give a range through primefaces slider component, with an optinally exact or inexact upper limit (that is the upper limit of the range could be 1000 or >1000). The optionality of the range is indicated through a checkbox.

In a form I have the following components:

<p:outputLabel value="From 1:"  />
<p:inputText style="display: block;margin-bottom: 3px;" id="lower" value="#{dilution.lower}" />
<p:outputLabel value="To 1:" />
<p:inputText style="display: block;margin-bottom: 3px;" widgetVar="upp" id="upper" value="#{dilution.upper}" />
<p:outputLabel value="Greater than 1000" for="above1000" />
<p:selectBooleanCheckbox id="above1000" value="#{dilution.bigger}" valueChangeListener="#{dilution.above}"  >
    <p:ajax update="upper" />
</p:selectBooleanCheckbox>
<h:outputText style="display: block;" id="displayRange" value="Choose from intervall 1:1 till 1:1000"/>                        
<p:slider id="dfact" displayTemplate="For intervall 1:{min} till 1:{max}" for="lower,upper" range="true" step="1" minValue="1" maxValue="1000" />

When the checkbox is checked I would like the value in the upper limit textfield to change to 1000 and if it is unchecked I don't want it to alter the value of the textfield.

I have almost got this to work using a valueChangeListner attached to the checkbox.

In the backing bean dilution I have the following valueChangeListner:

public void above(ValueChangeEvent event){
    if((Boolean)event.getNewValue()){
        upper = 1000;
    }        
}

which sets the value of the textfield upper to 1000. My problem is that it does this if I change the value of the textfield to some other number, then uncheck the textbox.

I'm guessing this is because the upper backing bean value is still set to 1000 from the previous time. I tried making the ajax call process the upper component like this:

<p:ajax update="upper" process="upper" />

because I thought this would make it process the upper component (and therefore change the backing bean value based on what was written in the textfield) before the update. But when I do this the textfield doesn't get set at all.

I then felt maybe using javascript to do this made more sense, avoiding any unneccassary calls to the server but can't figure out how to do it. I considered using widgetVar somehow but I can't find any documentation showing me how to use it.

Also it would be good if changing the value in the textfield changed where the slider was set, but this is less important.

Any hints what would be the best way to do this?

The way you're trying to do is not right.

I've re-written the example for you

XHTML Code

<!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"
    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:p="http://primefaces.org/ui"
    xmlns:fn="http://java.sun.com/jsp/jstl/functions">

<h:head>
    <title>Demo</title>
    <script type="text/javascript">

</script>
    <link rel=" stylesheet" type="text/css" href="css/style.css"></link>

    <h:body>
        <h:form id="form">
            <p:panel header="Form">

                <h:panelGrid columns="2">

                    <h:outputText value="From:" />
                    <p:inputText value="#{testBean.lower}" id="lower"></p:inputText>

                    <h:outputText value="To:" />
                    <p:inputText value="#{testBean.upper}" id="upper"></p:inputText>

                    <h:outputText value="Change Upper to Max" />
                    <p:selectBooleanCheckbox value="#{testBean.maxUpper}">
                        <p:ajax event="change" listener="#{testBean.chageMax}"
                            update=":form:upper"></p:ajax>
                    </p:selectBooleanCheckbox>

                    <h:outputText style="display: block;" id="displayRange"
                        value="Choose from intervall 1:1 till 1:1000" />
                    <p:slider id="dfact"
                        displayTemplate="For intervall 1:{min} till 1:{max}"
                        for=":form:lower,:form:upper" range="true" step="1" minValue="1"
                        maxValue="1000" />
                </h:panelGrid>

            </p:panel>
        </h:form>

    </h:body>

</h:head>

</html>

Managed Bean (back bean)

import javax.faces.bean.ManagedBean;
import javax.faces.bean.SessionScoped;

@ManagedBean(name = "testBean")
@SessionScoped
public class TestBean {

    private int lower;
    private int upper;
    private boolean maxUpper;

    public void chageMax() {
        if (maxUpper) {
            upper = 1000;
        } else {
            upper = 0;
        }
    }

    public boolean isMaxUpper() {
        return maxUpper;
    }

    public void setMaxUpper(boolean maxUpper) {
        this.maxUpper = maxUpper;
    }

    public int getLower() {
        return lower;
    }

    public void setLower(int lower) {
        this.lower = lower;
    }

    public int getUpper() {
        return upper;
    }

    public void setUpper(int upper) {
        this.upper = upper;
    }
}

Generated OUTPUT

I hope it helps.

链接地址: http://www.djcxy.com/p/68548.html

上一篇: Primefaces Datatable复选框影响复制和粘贴的能力

下一篇: 布尔复选框，设置文本字段的值