StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>Thanks @smiletolead for your guidance, I found a solution by integrating Dialog with CheckBoxListView and TriggerField class.</p> <p>The complete code listing is..</p> <pre><code> package com.ui.test.client; import java.util.List; import com.extjs.gxt.ui.client.data.ModelData; import com.extjs.gxt.ui.client.event.ComponentEvent; import com.extjs.gxt.ui.client.event.WindowEvent; import com.extjs.gxt.ui.client.event.WindowListener; import com.extjs.gxt.ui.client.store.ListStore; import com.extjs.gxt.ui.client.widget.CheckBoxListView; import com.extjs.gxt.ui.client.widget.Dialog; import com.extjs.gxt.ui.client.widget.form.TriggerField; import com.extjs.gxt.ui.client.widget.layout.FillLayout; import com.google.gwt.user.client.Element; public class MultiSelectComboBox extends TriggerField { private Dialog checkBoxListHolder; private CheckBoxListView listView; private ListStore store; private String delimiter = ","; private boolean readOnly; public MultiSelectComboBox() { store = new ListStore(); listView = new CheckBoxListView(); } @Override protected void onTriggerClick(ComponentEvent ce) { super.onTriggerClick(ce); if(readOnly) { return; } checkBoxListHolder.setSize(getWidth(), 200); listView.setWidth(getWidth()); checkBoxListHolder.setPosition(getAbsoluteLeft(), getAbsoluteTop() + getHeight()); if(checkBoxListHolder.isVisible()) { checkBoxListHolder.hide(); } else { checkBoxListHolder.show(); } } @Override protected void onRender(Element target, int index) { super.onRender(target, index); checkBoxListHolder = new Dialog(); checkBoxListHolder.setClosable(false); checkBoxListHolder.setHeaderVisible(false); checkBoxListHolder.setFooter(false); checkBoxListHolder.setFrame(false); checkBoxListHolder.setResizable(false); checkBoxListHolder.setAutoHide(false); checkBoxListHolder.getButtonBar().setVisible(false); checkBoxListHolder.setLayout(new FillLayout()); checkBoxListHolder.add(listView); listView.setStore(store); checkBoxListHolder.addWindowListener(new WindowListener(){ @Override public void windowHide(WindowEvent we) { setValue(parseCheckedValues(listView)); } }); } private String parseCheckedValues(CheckBoxListView checkBoxView) { StringBuffer buf = new StringBuffer(); if(checkBoxView != null) { List selected = checkBoxView.getChecked(); int index = 1, len = selected.size(); for(D c : selected) { buf.append(c.get(listView.getDisplayProperty())); if(index getListView() { return listView; } public void setListView(CheckBoxListView listView) { this.listView = listView; } public ListStore getStore() { return store; } public void setStore(ListStore store) { this.store = store; } public String getDelimiter() { return delimiter; } public void setDelimiter(String delimiter) { this.delimiter = delimiter; } public boolean isReadOnly() { return readOnly; } public void setReadOnly(boolean readOnly) { this.readOnly = readOnly; } } </code></pre> <p>The code has been explained here... <a href="http://bhat86.blogspot.com/2012/02/gxt-comobobox-with-multi-select-feature.html">http://bhat86.blogspot.com/2012/02/gxt-comobobox-with-multi-select-feature.html</a></p> <p>Thank you!</p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload