我正在尝试在 GXT 3 中创建一个带有选项和类别的组合框。
我可以使用ComboBoxCell为选项和类别提供不同的显示。
问题:我需要类别不可选择(如 HTML 标记 <optgroup> )。
这是一个普通的旧 HTML 组合框 ( <select> tag )
HTML 代码:
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<select>
<optgroup label="category 1">
<option name="option1">Option 1</option>
<option name="option2">Option 2</option>
<option name="option3">Option 3</option>
</optgroup>
<optgroup label="category 2">
<option name="option4">Option 4</option>
<option name="option5">Option 5</option>
<option name="option6">Option 6</option>
</optgroup>
</select>
</body>
</html>
正如您在 this fiddle 上看到的那样，它会生成一个带有不可选择类别的组合框。我正在尝试用 GXT 做同样的事情。
有什么想法吗？
编辑:
我终于做了自己的实现:
import com.google.gwt.user.client.DOM;
import com.google.gwt.user.client.Element;
import com.google.gwt.user.client.ui.UIObject;
import com.google.gwt.user.client.ui.Widget;
import java.util.Collection;
import java.util.HashMap;
import java.util.HashSet;
import java.util.Map;
public class Select<T> extends Widget {
private static final String TAG_OPTGROUP = "optgroup";
private static final String ATTR_NAME = "name";
private static final String PROPERTY_SELECTED = "selected";
private Element select;
private Map<Element, T> mapElement;
public Select(boolean multiple){
this.mapElement=new HashMap<Element, T>();
this.select = DOM.createSelect(multiple);
this.setElement(this.select);
}
public Select(){
this(false);
}
public OptGroup addGroup(String displayName){
OptGroup optGroup=new OptGroup(displayName);
this.select.appendChild(optGroup.getElement());
return optGroup;
}
public void addOption(T t,String displayName){
Element option=DOM.createOption();
option.setAttribute(ATTR_NAME,t.toString());
option.setInnerText(displayName);
this.select.appendChild(option);
this.mapElement.put(option,t);
}
public T getSelectedValue(){
for(Map.Entry<Element,T> entry:mapElement.entrySet()){
if(entry.getKey().getPropertyBoolean(PROPERTY_SELECTED)){
return entry.getValue();
}
}
return null;
}
public Collection<T> getSelectedValues(){
Collection<T> result=new HashSet<T>();
for(Map.Entry<Element,T> entry: mapElement.entrySet()){
if(entry.getKey().getPropertyBoolean(PROPERTY_SELECTED)){
result.add(entry.getValue());
}
}
return result;
}
public class OptGroup extends UIObject {
private static final String ATTR_LABEL="label";
private String name;
private Element element;
private OptGroup(String name) {
this.name = name;
this.element = DOM.createElement(TAG_OPTGROUP);
this.element.setAttribute(ATTR_LABEL,name);
this.setElement(this.element);
}
public String getName() {
return name;
}
public void addOption(T t,String displayName){
Element option=DOM.createOption();
option.setAttribute(ATTR_NAME,t.toString());
option.setInnerText(displayName);
this.element.appendChild(option);
mapElement.put(option,t);
}
}
}
这是完美的，因为我使用 toString()对于属性 name <option>的标签，但它满足我的需要;)
最佳答案
我认为 gwt 列表框不支持 optgroup。您必须使用 DOM API。像这样的事情就可以了
List<String> options = new ArrayList<String>();
options.add("Option 1");
options.add("Option 2");
options.add("Option 3");
ListBox combo = new ListBox();
SelectElement selectElm = combo.getElement().cast();
OptGroupElement groupElement =Document.get().createOptGroupElement();
groupElement.setLabel("category 1");
for (String option : options)
{
OptionElement optElement = Document.get().createOptionElement();
optElement.setInnerText(option.getName());
groupElement.appendChild(optElement);
}
selectElm.appendChild(groupElement);
关于java - 具有不可选择类别的 GXT 组合框，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/17315547/