change value of one generatedcolumn from another generated column in table

Hi Vaadin Pros,
I need help, I spent lot of time on this but didn’t work. I tried to look up for similar solution but failed.

I’ve two generated columns in table

  1. combobox ( alow, deny values)
  2. checkbox (read-only)

when I change the combobox value to allow, checkbox for that row should be checked (if unchecked…well it doesn’t matter) and vice versa.

Can anyone please help.

Hi,

you can create your own ColumnGenerator and link the generated fields there. Here’s a quick example - might not be exactly what you need but should be enough to get the idea:

Table t = new Table();
for (int i = 0; i < 500; i++) {
	t.addItem(i);
}

ColumnGenerator cg = new ColumnGenerator() {
	private final Map<Object, ComboBox> combos = new HashMap<Object, ComboBox>();
	private final Map<Object, CheckBox> checks = new HashMap<Object, CheckBox>();

	public Object generateCell(Table source, final Object itemId,
			Object columnId) {
		if ("foo".equals(columnId)) {
			ComboBox cb = new ComboBox();
			cb.setImmediate(true);
			cb.addItem("allow");
			cb.addItem("deny");
			combos.put(itemId, cb);
			cb.addListener(new Property.ValueChangeListener() {

				public void valueChange(ValueChangeEvent event) {
					if ("allow".equals(event.getProperty().getValue())) {
						checks.get(itemId).setValue(true);
					} else if ("deny".equals(event.getProperty()
							.getValue())) {
						checks.get(itemId).setValue(false);
					}
				}
			});
			return cb;
		} else if ("bar".equals(columnId)) {
			CheckBox cb = new CheckBox();
			cb.setImmediate(true);
			checks.put(itemId, cb);
			cb.addListener(new Property.ValueChangeListener() {

				public void valueChange(ValueChangeEvent event) {
					if (Boolean.TRUE.equals(event.getProperty()
							.getValue())) {
						combos.get(itemId).setValue("allow");
					} else if (Boolean.FALSE.equals(event.getProperty()
							.getValue())) {
						combos.get(itemId).setValue("deny");
					}
				}
			});
			return cb;
		}
		return null;
	}
};
t.addGeneratedColumn("foo", cg);
t.addGeneratedColumn("bar", cg);

-tepi

Hi Tepi,
Thanks a lot for your approach. I found different way of doing it but I like yours better. In my case checkboxes are read only so I was getting read only exception in combobox value change listener. So I tweaked to get the check box and make readonly as false then set the value and then make it read only again(inside value change listener of combo box). since my checkboxes are readonly I don’t need propertychange listener for checkbox from your approach.

Anyways the approach I tried before Tepi’s might be useful for something else.

my table was bean itemcontainer lets say the bean name is Person

addGeneratedColumn("foo", new Table.ColumnGenerator() {

			private static final long serialVersionUID = -7794540508526020458L;

			public Object generateCell(final Table source, final Object itemId,
					Object columnId) {
				final Person bean = (Person) itemId;
				final NativeSelect cb = new NativeSelect();

				cb.addStyleName("small");
				cb.setImmediate(true);

				cb.addItem("Allow");
				cb.addItem("Deny");
				cb.setValue((StringUtils.isBlank(bean.getFoo())?"":bean.getFoo());
				cb.addListener(new Property.ValueChangeListener() {

					private static final long serialVersionUID = 4229066822459853114L;

					public void valueChange(Property.ValueChangeEvent event) {
						 if("Allow".equals(event.getProperty().toString())){
							bean.setInEffect(true);
						}else if("Deny".equals(event.getProperty().toString())){
							bean.setInEffect(false);
						}
						bean.setFoo((event.getProperty().getValue()==null)?"":event.getProperty().toString());
						removeGeneratedColumn("checkBoxCol");
						addGeneratedColumn("checkBoxCol", new CheckBoxColumnGenerator("inEffect", true, null));
					}
				});
				return cb;
			}

		});

		addGeneratedColumn("checkBoxCol", new CheckBoxColumnGenerator("checkBoxCol", true, null));

CheckBoxColumnGenerator is a class with constructor which returns readonly checkbox. the above approach also works fine but it repaints whole table when ever combo box value is changed which I hate to do.

Hi guys,

How do you change layout based on combo box item selection? For example, if I’ve three items and I want to change the layout based on item selected in the combo box… how do I acheive that? Here is my sample code:

ComboBox combo = new ComboBox("My combo box");
combo.addItems("item 1", "item 2", "item 3");
combo.setTextInputAllowed(false);
combo.setNullSelectionAllowed(false);
combo.select("item 1");
combo.setImmediate(true);
combo.addValueChangeListener(new Property.ValueChangeListener() {
/**
*
private static final long serialVersionUID = 1L;
@Override
public void valueChange(ValueChangeEvent event) {
Notification.show("Selected item: " + event.getProperty().getValue(), Type.HUMANIZED_MESSAGE);
}
});
   ExampleGrid grid = new ExampleGrid();
        grid.setWidth(100, Unit.PERCENTAGE);
        Panel panel = new Panel(grid);
        panel.setSizeFull();
        addComponent(panel);

So there are three panels created for three items in the combo box… but I don’t know how to change the layout based on item selected inside a combo box?

Of course I can get the first panel easily. But, I want to see all three panels based on combo box selection.

Your help is appreciated.