是否有可能通过本地或ExtLib组合框控件选择<optgroup>
选择标签?optgroup与组合框控件
我想使用原生解决方案,所以getComponent()或验证器将工作。我认为这不符合jQuery/dojo的内联html。
是否有可能通过本地或ExtLib组合框控件选择<optgroup>
选择标签?optgroup与组合框控件
我想使用原生解决方案,所以getComponent()或验证器将工作。我认为这不符合jQuery/dojo的内联html。
我已经找到了我的问题的答案。 Domino Designer中组合框的计算值可以返回字符串矢量/数组,通常作为@DbLookup或@DbColumn的返回值。在做实验的过程中,我发现你可以为选择的项目返回本地组件,包括组(从选择项继承)。 以下片段将构建我想要的内容:项目的分组层次结构。
<?xml version="1.0" encoding="UTF-8"?>
<xp:view xmlns:xp="http://www.ibm.com/xsp/core">
<xp:comboBox id="comboBox1" value="#{viewScope.combo}">
<xp:selectItems>
<xp:this.value><![CDATA[${javascript:var itms = new javax.faces.model.SelectItem[2];
var itm = null;
itm = new javax.faces.model.SelectItem();
itm.setLabel("label1");
itms[0] = itm;
itm = new javax.faces.model.SelectItem();
itm.setLabel("label2");
itms[1] = itm;
var g = new javax.faces.model.SelectItemGroup();
g.setLabel("Group");
g.setSelectItems(itms);
g
}]]></xp:this.value>
</xp:selectItems>
</xp:comboBox>
</xp:view>
样品:
基于这个例子中,你可以将多个数据源来构建计算<optgroup>
连击,包括支持豆类或范围变量。
似乎并不支持<optGroup>
标签喷射器。但是,与不合格jQuery/dojo的假设相反,这似乎是解决方案。 getComponent(),getValue(),setValue()等等仍然有效。
您需要的每一个<optGroup>
都需要做的唯一事情就是添加一个<xp:selectItem itemLabel="With your optGroup label" itemValue"optGroup1"></xp:selectItem>
。当使用多个<optGroups>'s
时,itemValue
需要增加1.我粘贴下面的一个例子,希望这有助于。
<xp:this.resources>
<xp:script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" clientSide="true"></xp:script>
</xp:this.resources>
...
<xp:comboBox id="comboBox1" styleClass="optGroup">
<xp:selectItem itemLabel="Swedish Cars" itemValue="optGroup1"></xp:selectItem>
<xp:selectItem itemLabel="Volvo" itemValue="volvo"></xp:selectItem>
<xp:selectItem itemLabel="Saab" itemValue="saab"></xp:selectItem>
<xp:selectItem itemLabel="German Cars" itemValue="optGroup2"></xp:selectItem>
<xp:selectItem itemLabel="Mercedes" itemValue="mercedes"></xp:selectItem>
<xp:selectItem itemLabel="Audi" itemValue="audi"></xp:selectItem>
</xp:comboBox>
<xp:scriptBlock id="scriptBlock1">
<xp:this.value><![CDATA[
//Iterate across the <option>'s for which the itemValues begin with "optGroup".
$('.optGroup option[value^="optGroup"]').each(function(index, node) {
//Use the actual itemValue ("optGroup1") to get all its siblings until the next
//<option> is found with (again) an itemValue of "optGroup" (i.e. "optGroup2").
$('.optGroup option[value="' + node.value + '"]').
//No harm for last iteration: .nextAll() will be used if the selector is
//not matched or is not supplied (in this example "optGroup3" won't get a match).
nextUntil('.optGroup option[value="optGroup' + (index + 2) + '"]').
//Wrap them in a <optGroup> tag and give it its label (itemLabel).
wrapAll('<optGroup label="' + node.text + '"></optGroup>');
//Remove the initial <option> since we no longer need it.
$(this).remove();
});
]]></xp:this.value>
</xp:scriptBlock>
<xp:button value="Submit" id="button1">
<xp:eventHandler event="onclick" submit="true"
refreshMode="complete">
<xp:this.action><![CDATA[#{javascript:
print("Submitting: " + getComponent("comboBox1").getValue());
}]]></xp:this.action>
</xp:eventHandler>
</xp:button>
感谢您的回答,但我尽量避免客户端脚本攻击,直到需要。我不使用JQuery。 –