Friday, July 27, 2012

XPages - Grouping data in comboboxes

I wanted to have some values grouped in a ComboBox. Not sure if it's possible to do with pure SSJS (without using the Java API), but found a way using beans:
JSF Tree in a dropdown (see accepted answer).

The resulting html is select node with options grouped in optgroup nodes.

2 comments:

Naveen said...
This comment has been removed by the author.
Naveen said...

I was trying achieve the same result. Thanks to your link I was finally able to do it. I used SSJS and the JSF API classes to get this thing done on the XPage instead.

I added formula item to my combo box and put the following code in it:

var options:java.util.ArrayList = new java.util.ArrayList();

var group1:javax.faces.model.SelectItemGroup = new javax.faces.model.SelectItemGroup("Group 1");
var group1Items = new Array();
group1Items[0] = new javax.faces.model.SelectItem("Group 1 Value 1", "Group 1 Label 1");
group1Items[1] = new javax.faces.model.SelectItem("Group 1 Value 2", "Group 1 Label 2");
group1Items[2] = new javax.faces.model.SelectItem("Group 1 Value 3", "Group 1 Label 3");
group1.setSelectItems(group1Items);

var group2:javax.faces.model.SelectItemGroup = new javax.faces.model.SelectItemGroup("Group 2");
var group2Items = new Array();
group2Items[0] = new javax.faces.model.SelectItem("Group 2 Value 1", "Group 2 Label 1");
group2Items[1] = new javax.faces.model.SelectItem("Group 2 Value 2", "Group 2 Label 2");
group2Items[2] = new javax.faces.model.SelectItem("Group 2 Value 3", "Group 2 Label 3");
group2.setSelectItems(group2Items);

options.add(group1);
options.add(group2);

return options;

Thanks again :)