如何在检票口中实现带有 2 个相关下拉菜单的可编辑网格？

Question

我需要使用编辑、保存、取消、删除按钮以表格格式显示数据库中的数据，它在检票口中称为可编辑网格。

在点击编辑按钮后的表格行中，数据应显示在 2 个下拉选项中并从第一个下拉列表中选择数据，然后应根据第一个下拉列表的选择更改第二个下拉数据模型。

我已经通过https://github.com/wicketstuff/core/tree/master/editable-grid-parent。但它只显示可编辑的网格，在检票口中有 1 个下拉菜单，我想要 2 个下拉菜单。请帮忙。

更新： 我用过这个

    private List<AbstractEditablePropertyColumn<Person, String>> getColumns()
         {
    List<AbstractEditablePropertyColumn<Person, String>> columns = new ArrayList<AbstractEditablePropertyColumn<Person, String>>();
    stateDropDownPropertyColumn = new AbstractEditablePropertyColumn<Person, String>(new PropertyModel<String>(this, "selectedMake"), "state")
    {

        private static final long serialVersionUID = 1L;

        public EditableCellPanel<Person> getEditableCellPanel(String componentId)
        {

            return getStateDDCellpanel(componentId,this);               
        }
    };

    cityDropDownPropertyColumn = new AbstractEditablePropertyColumn<Person, String>(new Model<String>("CarModel"), "city"){

        private static final long serialVersionUID = 1L;

        @Override
        public EditableCellPanel<Person> getEditableCellPanel(String componentId) {
            // TODO Auto-generated method stub
            return getCityDDCellpanel(componentId,this);
        }};

    columns.add(stateDropDownPropertyColumn);
    columns.add(cityDropDownPropertyColumn);
    return columns;
}
    private EditableRequiredDropDownCellPanel<Person, String> getStateDDCellpanel(String componentId, 
                                    AbstractEditablePropertyColumn<Person, String> DropDownPropertyColumn){

    this.stateComponentID = componentId;
    this.stateDropDownPropertyColumn = DropDownPropertyColumn;
    stateDropDownCellPanel = new EditableRequiredDropDownCellPanel<Person,      String>(stateComponentID, stateDropDownPropertyColumn, stateChoices);

    return stateDropDownCellPanel;

}

private EditableRequiredDropDownCellPanel<Person, String> getCityDDCellpanel(String componentId, 
        AbstractEditablePropertyColumn<Person, String> DropDownPropertyColumn){

    this.cityComponentID = componentId;
    this.cityDropDownPropertyColumn = DropDownPropertyColumn;
    cityDropDownCellPanel = new EditableRequiredDropDownCellPanel<Person, String>(cityComponentID, cityDropDownPropertyColumn, cityChoices);
    cityDropDownCellPanel.setOutputMarkupId(true);
    cityDropDownCellPanel.setOutputMarkupPlaceholderTag(true);
    return cityDropDownCellPanel;

}

我不知道我需要在哪里放置下拉单元格的行为。

Answer 1

根据动态列表可能几乎直接回答问题（第一个是固定的，第二个 id 取决于，动态计算）： http://examples7x.wicket.apache.org/ajax/choice

为了遵守不包含纯链接的 SO 规则，摘自 Apache 授权的官方示例 （准备更短 - 不编译）

模型允许您准备更改的数据，并且 AJAX 事件强制刷新 - 这是理念的核心。事件（ajax 行为）连接到第一个“制造者”，并且行为强制刷新“模型”。这是典型的 wicket+ajax 模式。

/**
* Linked select boxes example
* 
* @author Igor Vaynberg (ivaynberg)
*/
 public class ChoicePage extends BasePage
{
private String selectedMake;

private final Map<String, List<String>> modelsMap = new HashMap<>(); // map:company->model

/**
 * @return Currently selected make
 */
public String getSelectedMake()
{
    return selectedMake;
}

/**
 * @param selectedMake
 *            The make that is currently selected
 */
public void setSelectedMake(String selectedMake)
{
    this.selectedMake = selectedMake;
}

/**
 * Constructor.
 */
public ChoicePage()
{
    modelsMap.put("AUDI", Arrays.asList("A4", "A6", "TT"));
    modelsMap.put("CADILLAC", Arrays.asList("CTS", "DTS", "ESCALADE", "SRX", "DEVILLE"));
    modelsMap.put("FORD", Arrays.asList("CROWN", "ESCAPE", "EXPEDITION", "EXPLORER", "F-150"));

    IModel<List<String>> makeChoices = new AbstractReadOnlyModel<List<String>>()
    {
        @Override
        public List<String> getObject()
        {
            return new ArrayList<>(modelsMap.keySet());
        }

    };

    IModel<List<String>> modelChoices = new AbstractReadOnlyModel<List<String>>()
    {
        @Override
        public List<String> getObject()
        {
            List<String> models = modelsMap.get(selectedMake);
            if (models == null)
            {
                models = Collections.emptyList();
            }
            return models;
        }

    };

    Form<?> form = new Form("form");
    add(form);

    final DropDownChoice<String> makes = new DropDownChoice<>("makes",
        new PropertyModel<String>(this, "selectedMake"), makeChoices);

    final DropDownChoice<String> models = new DropDownChoice<>("models",
        new Model<String>(), modelChoices);
    models.setOutputMarkupId(true);

    form.add(makes);
    form.add(models);

    ...

    makes.add(new AjaxFormComponentUpdatingBehavior("change")
    {
        @Override
        protected void onUpdate(AjaxRequestTarget target)
        {
            target.add(models);
        }
    });
  }
}

评论后更新。让我们回到之前的 github 代码，必须按模型替换固定列表。如何？？？派生或复制，使用 IModel 添加构造函数... Wicket 具有非常好的对象设计。 以类似的方式，我们添加网格作者不知道（未计划）的列类型。

顺便说一句，您的评论“它不起作用”非常广泛。抱歉，如果可以，我可以提供帮助，但不要为您制作完整的项目。希望您会喜欢编码。

package org.wicketstuff.egrid.column;

import java.util.List;

import org.apache.wicket.extensions.markup.html.repeater.data.table.PropertyColumn;
import org.apache.wicket.markup.html.form.DropDownChoice;
import org.apache.wicket.markup.html.form.FormComponent;
/**
 * 
 * @author Nadeem Mohammad
 *
 */
public class EditableRequiredDropDownCellPanel<T, S> extends EditableCellPanel
{

    private static final long serialVersionUID = 1L;

    public EditableRequiredDropDownCellPanel(final String id, final PropertyColumn<T, S> column, @SuppressWarnings("rawtypes") final List choices)
    {
        super(id);

        @SuppressWarnings("unchecked")
        DropDownChoice<T> field = new DropDownChoice<T>("dropdown", choices);  <--- **** Here should be model ****
        field.setLabel(column.getDisplayModel());
        add(field); 
    }

    @Override
    public FormComponent<?> getEditableComponent()
    {
        return (FormComponent<?>) get("dropdown");
    }
}

然后在这里更改类返回：

columns.add(new AbstractEditablePropertyColumn<Person, String>(new Model<String>("Age"), "age")
        {

            private static final long serialVersionUID = 1L;

            public EditableCellPanel getEditableCellPanel(String componentId)
            {
                return new ***** EditableRequiredDropDownCellPanel ***** <Person, String>(componentId, this, Arrays.asList("10","11","12","13","14","15"));
            }

});

也添加 Beahviours