Checkboxgroup

Ask the community
,
1

Hi,

I appreciate if you can help me. I want to create a set of checkbox dynamically through dataset. I have no idea how to do. I tried to inset a checkbox, but I didn’t see any option to create it dynamically with more than one checkbox.

thanks.

2

Greetings,

In the Corvid index of examples , there is a multi-select dropdown that may be helpful to you.

3

Thank you.

4

@arolivesilva CheckboxGroups were recently introduced. It is possible to dynamically create the checkboxes in the group based on field values in a collection. That may be easier and preferable to the example noted above.

5

@tony-brunsman As I am a begginer, do you have any example?

6

@arolivesilva This is not a beginner’s coding task, but you are wanting to push the limits a little here wondering if something can be done.

This example does an aggregate query to get the unique city values in a collection, and then creates a checkbox in a checkbox group for each of those cities. You could call this in the onReady event of a page. To get an idea of the data that the aggregate query returns, be sure and take a look at your console and expand the ellipsis button.

export function PopulateCityGroup(){
    wixData.aggregate("membership")
    .group("city")
    .count()
    .ascending("_id")
    .run()
    .then((results) => {
        console.log(results);
         let item = [],Option = {},Cities = [];
         if (results.length > 0){
             for (var i = 0; i < results.length; i++) {
                item = results.items[i];
                // create checkbox option object.
                Option = {"label": item._id,"value": item._id};
                // add the option to the Cities array
                Cities.push(Option);
            }
            // load the Cities array to the checkbox group.
            $w('#CityGroup').options = Cities;
        }
    })
    .catch((error) => {
         let errorMsg = error.message;
         let code = error.code;
    });
}
7

@tony-brunsman Thanks for your supporting. I got it using repeater.

8

@tony-brunsman Does it again !!! amazing stuff man thanks saved me alot of effort! also useful in eliminating any potential mismatches in data by hand typing the checkbox values… great work man