Question

我有一个带有相关inputText的PrimeFaces滑块。一切都运行正常，除了我找不到格式化inputText值的方法。我希望inputText以货币格式显示和获取值。

到目前为止我尝试过：

使用p:inputText组件更改pe:inputNumber：导致异常，因为无法设置该值（滑块根本无法与inputNumber一起使用）;
将p:slider目标设置为h:inputHidden组件，其值与p:inputText（附加f:convertNumber）相同：在通过滑块更改值时有效，但是使用inputText更改值滑块不更新（在后台抛出UpdateModelException）;

更新：后来发现第二个选项异常被抛出，因为f:convertNumber需要数字类型的bean属性，而不是整数。下面显示的两个解决方案都解决了这个问题。

有没有一种简单的方法可以在不使用jQuery的情况下执行此操作？

谢谢！

菲利普

Answer 1

下面我发布了获取自定义inputText的最低要求，但您丢失了实时更新。

<强> SliderView.java

private int number1 = 0;
private String number2 = String.valueOf(number1);

public int getNumber1() {
return number1;
}

public void setNumber1(int number1) {
this.number1 = number1;
}



public String getNumber2() {
return number2;
}

public void setNumber2(String number2) {
this.number2 = number2;
}

public void converToInt() {
log.debug(number2);
//TODO should be improved
this.number1 = Integer.parseInt(number2);
}

public void onSlideEnd(SlideEndEvent event) {
log.debug("current number: " + event.getValue());
this.number1 = event.getValue();
this.number2 = String.valueOf(event.getValue());

}

<强> slider.xhtml

<h:form id="bcr_form_2" styleClass="form">
    <h:panelGrid columns="1" style="margin-bottom: 10px">
        <p:inputMask id="output" value="#{sliderView.number2}">
            <p:ajax event="keyup" listener="#{sliderView.converToInt}" update="@form:txt @form:slider" />
            <f:converter converterId="CurrencyConverter" />
            <pe:keyFilter regEx="/[0-9_]/i" />
        </p:inputMask>
        <h:inputHidden id="txt" value="#{sliderView.number1}" />
        <p:slider id="slider" for="txt" style="width: 200px">
            <p:ajax event="slideEnd" listener="#{sliderView.onSlideEnd}" update="@form:output" />
        </p:slider>
    </h:panelGrid>
</h:form>

<强> CurrencyConverter.java

@FacesConverter("CurrencyConverter")
public class CurrencyConverter implements Converter {
  @Override
  public Object getAsObject(FacesContext context, UIComponent component, String value) {
    return value.replace('€', ' ').trim();
  }

  @Override
  public String getAsString(FacesContext context, UIComponent component, Object value) {
    return value.toString() + "€";
  }
}

很高兴能提供帮助。

Answer 2

因此有两种方法可以解决这个问题：

创建自定义转换器（由@ giaffa86在其解决方案中起草）;
启用Number getter和setter到int属性并将它们与inputText一起使用（简单来说，IMO）。

下面的代码显示了如何实现第二个选项。

<强> TestView.java

@ManagedBean(name="testView")
@ViewScoped
public class TestView {

    private int realValue = 500;

    public int getValueAsInt() {
        return this.realValue;
    }

    public Number getValueAsNumber() {
        return (Number)realValue;
    }

    public void setValueAsInt(int value) {
        this.realValue = value;
    }

    public void setValueAsNumber(Number value) {
        this.realValue = value.intValue();
    }

    public void onSlideEnd(SlideEndEvent event) {
        this.realValue = event.getValue();
    }
}

<强> view.xhtml

    <p:inputText id="input" value="#{testView.valueAsNumber}">
        <p:ajax update="slider" />
        <f:convertNumber currencySymbol="$" type="currency"
            integerOnly="true" />
    </p:inputText>

    <h:inputHidden id="hidden" value="#{testView.valueAsInt}" />
    <p:slider id="slider" for="hidden" minValue="0" maxValue="1000" step="10">
        <p:ajax event="slideEnd" listener="#{testView.onSlideEnd}" update="input" />                    
    </p:slider>

作为第一个选项，此解决方案也会失去实时更新，但在我的方案中没有问题。

格式化PrimeFaces Slider InputText

2 个答案: