Question

我只是想寻找额外的一双眼睛来发现为什么儿童面板不显示/更改单选按钮选择/更改的可见性，这需要他们刷新


public class OptionsPanel extends Panel {
    private AutoCompleteSearchField departureField;
    private HiddenField departureCodeField;
    private CompoundPropertyModel model;
    private RadioGroup flightChoices;
    private RadioGroup dateChoices;
    private final TripSearchModel tripSearchModel;
    private WebMarkupContainer optionsContainer;
    private FlexibleDates flexibleDates;
    private FixedDates fixedDates;
    private PassengersAndClass passengersAndClass;
    private static List FIX_CONTAINER_VISIBLE = Lists.newArrayList(true, false, true);
    private static List FLEX_CONTAINER_VISIBLE = Lists.newArrayList(false, true, true);
    private static List HIDE_CONTAINERS = Lists.newArrayList(false, false, false);

    public OptionsPanel(String id, CompoundPropertyModel model) {
        super(id);
        this.model = model;
        this.tripSearchModel = (TripSearchModel) model.getObject();

        add(departureLabel());
        add(departureField());
        add(departureCodeField());

        add(flightType());
        add(travellingWhen());
        add(dateType());

        add(optionsContainer(HIDE_CONTAINERS));
    }

    private Component departureLabel() {
        return new WebMarkupContainer("departureLabel").setOutputMarkupId(true);
    }

    private AutoCompleteSearchField departureField() {
        departureField = new AutoCompleteSearchField("departureField", "From", "flightFromField", null, true, model.bind("departure"));
        departureField.setOutputMarkupId(true);
        departureField.add(new CityValidator(this, departureCodeField));
        return departureField;
    }

    private HiddenField departureCodeField() {
        departureCodeField = new HiddenField("departureCodeField", model.bind("departureCode"));
        departureCodeField.setMarkupId("departureFieldCode");
        return departureCodeField;
    }

    private Component flightType(){
        flightChoices = new RadioGroup("flightTypes");
        flightChoices.setModel(model.bind("tripType"));
        flightChoices.add(listOfRadio(flightsTypeList(), "flightType"));
        return flightChoices;
    }

    private List flightsTypeList() {
        return Arrays.asList(
                new RadioOptionObject("one way", new Model(TRIP_TYPE_ONE_WAY)),
                new RadioOptionObject("return", new Model(TRIP_TYPE_RETURN))
        );
    }

    private Component travellingWhen(){
        return new Label("travellingWhen", new StringResourceModel("travelling_when", this, new Model("")).getString());
    }

    private Component dateType(){
        dateChoices = new RadioGroup("dateTypes");
        dateChoices.setModel(model.bind("dateType"));
        dateChoices.add(listOfRadio(datesTypeList(), "dateType"));
        return dateChoices;
    }

    private List datesTypeList() {
        return Arrays.asList(
                new RadioOptionObject("Flexible dates", new Model(DATE_TYPE_FLEX)),
                new RadioOptionObject("Fixed dates", new Model(DATE_TYPE_FIX)));
    }

    private ListView listOfRadio(final List flightDateOptionValues, final String componentId) {
        ListView listView = new ListView(componentId + "sList", flightDateOptionValues) {
            @Override
            protected void populateItem(final ListItem listItem) {
                final Radio radio = new Radio(componentId + "Radio", ((RadioOptionObject) listItem.getModelObject()).getRadioModel()) {
                    @Override
                    public String getValue() {
                        return listItem.getDefaultModelObjectAsString();
                    }

                    @Override
                    protected boolean getStatelessHint() {
                        return true;
                    }
                };
                radio.add(new AjaxEventBehavior("onchange") {
                    @Override
                    protected void onEvent(AjaxRequestTarget target) {
                        tripSearchModel.setDateType(radio.getModelObject().toString());
                        refreshPanel(target);
                    }
                });
                listItem.add(radio);
                listItem.add(new Label(componentId + "Name", new StringResourceModel(radio.getModelObject().toString(), this, radio.getModel())));
            }
        };
        return listView;
    }

    private void refreshPanel(AjaxRequestTarget target) {
        this.remove(optionsContainer);
        target.addComponent(optionsContainer(visibility()));
    }

    private List visibility() {
        return visibilityMode(((TripSearchModel) model.getObject()).getDateType());
    }

    private Component optionsContainer(List visibility){
        optionsContainer = new WebMarkupContainer("optionsContainer");
        optionsContainer.add(flexibleDates(visibility.get(0)));
        optionsContainer.add(fixedDates(visibility.get(1)));
        optionsContainer.add(passengersAndClass(visibility.get(2)));
        optionsContainer.setOutputMarkupId(true);
        optionsContainer.setVisible(true);
        return optionsContainer;
    }

    private Component flexibleDates(Boolean visibility){
        flexibleDates = new FlexibleDates("flexibleDates", model);
        flexibleDates.setOutputMarkupId(true);
        flexibleDates.setVisible(visibility);
        return flexibleDates;
    }

    private Component fixedDates(Boolean visibility){
        fixedDates = new FixedDates("fixedDates", model);
        fixedDates.setOutputMarkupId(true);
        fixedDates.setVisible(visibility);
        return fixedDates;
    }

    private Component passengersAndClass(Boolean visibility){
        passengersAndClass = new PassengersAndClass("passengersAndClass", model);
        passengersAndClass.setOutputMarkupId(true);
        passengersAndClass.setVisible(visibility);
        return passengersAndClass;
    }

    private List visibilityMode(String dateType) {
        if(DATE_TYPE_FIX.equalsIgnoreCase(dateType)){
            return FIX_CONTAINER_VISIBLE;
        } else if(DATE_TYPE_FLEX.equalsIgnoreCase(dateType)){
            return FLEX_CONTAINER_VISIBLE;
        } else{
            return HIDE_CONTAINERS;
        }
    }
}

Answer 1

我认为您可能遇到的一个潜在问题是您正在侦听ajax-onchange事件，并且您尝试根据假定已更改的模型对面板进行更改。根据我对无线电类型表单组件的使用经验，您可能需要使用AjaxFormComponentUpdatingBehavior（而不是AjaxEventBehavior）来捕获对此类表单组件模型的更改。希望这有帮助！

编辑：我没有列出警告（您需要对某些表单组件使用其他类型的行为），我只需添加指向文档的链接：Javadoc for AjaxFormComponentUpdatingBehavior

Answer 2

在一天结束时，我发现还有一个隐藏的复活节彩蛋。

radio.add(new AjaxEventBehavior("onchange") {
                    @Override
                    protected void onEvent(AjaxRequestTarget target) {
                        tripSearchModel.setDateType(radio.getModelObject().toString());
                        refreshPanel(target);
                    }

我在两个不同的无线电组的事件上更改相同的日期参数，这使得表格无用。这是一个变化，第二个变化是从WebMarkupContainer转移到EnclosureContainer，建议在Wicket邮件列表上使用更改其可见性状态的组件。不过我会尝试使用AjaxFormComponentUpdatingBehavior感谢@Martin Peters

Wicket儿童面板刷新

2 个答案: