moon.DataList with moon.CheckboxItems and Group behaviour

I would like to dynamically build a list of checkboxItems from a collection, where only one item can be active.

I was hoping something like this would work:
    name: "myapp.MainView",
    components: [
        {kind: "moon.DataList", groupSelection: true, components: [
            {kind: "moon.CheckboxItem", handleTapEvent: false, bindings: [{from: "", to: ".content"}]}
    create: function () {
        this.$.dataList.collection = new enyo.Collection(["item1","item2","item3","item4"]); 
It doesn't work, I can select all of the items simultaneously.
What is the correct way to use the groupSelection property?

I also tried to nest the whole Datalist in an enyo.Group (and vice versa), but then nothing rendered.


  • A few of thoughts:

    1) Don't use a CheckBoxItem unless there's some compelling reason to.
    2) Use the 'selectionProperty' of the DataList to tie to the selected property in your model
    3) Make sure your model includes a selection property

    The DataList/DataRepeater has support for the selection property already, so you can use that to style your rows. Like such:
  • Thank you.
Sign In or Register to comment.