Skip to main content
cancel
Showing results for 
Search instead for 
Did you mean: 
Not applicable

Items array input?

Is it possible to create a custom array input in the layout definition like uses : dimension or measures?

1 Solution

Accepted Solutions
Not applicable
Author

I figured out an solution, not sure if it's the right way but it's a start

define(["jquery"], function($) {

    return {

        initialProperties : {

            version: 1.0

           

        },

        definition : {

            type : "items",

            component : "accordion",

            items : {

                itemsList:     {

                    type: "array",

                    translation: "Items",

                    ref: "kfItemsList",

                    min: 1,

                    allowAdd: true,

                    allowRemove: true,

                    allowMove: true,

                    addTranslation: "Add Items",

                    grouped: true,

                    items: {

                        itemType: {

                            type: "string",

                            component: "dropdown",

                            ref: "kfType",

                            translation: "Item type",

                            options: [{

                                value: "A",

                                label: "A-type"

                            }, {

                                value: "B",

                                label: "B-type"

                            }, {

                                value: "C",

                                label: "C-Type"

                            }],

                            show: true,

                            defaultValue: "A"

                        }

                    }

                }

            }

        },

        paint: function ($element, layout) {

            console.log(layout);

            var html = '';

            $.each(layout.kfItemsList, function(key, value) {

                    html += '<div>Item: '+ (key+1) + ' Item type: ' + value.kfType +'</div>'

                    console.log(value);

                });

            $element.html(html);

        }

    }

});

View solution in original post

4 Replies
Not applicable
Author

That's not what I was looking. Let me try to explain better.

In Qlik Sense a want to use an array of items with a buttom "Add item" and be able to remove items just like the dimension component.

initialProperties : {

  version : 1.0,

  ...

  },

  definition : {

  type : "items",

  component : "accordion"

Not applicable
Author

I figured out an solution, not sure if it's the right way but it's a start

define(["jquery"], function($) {

    return {

        initialProperties : {

            version: 1.0

           

        },

        definition : {

            type : "items",

            component : "accordion",

            items : {

                itemsList:     {

                    type: "array",

                    translation: "Items",

                    ref: "kfItemsList",

                    min: 1,

                    allowAdd: true,

                    allowRemove: true,

                    allowMove: true,

                    addTranslation: "Add Items",

                    grouped: true,

                    items: {

                        itemType: {

                            type: "string",

                            component: "dropdown",

                            ref: "kfType",

                            translation: "Item type",

                            options: [{

                                value: "A",

                                label: "A-type"

                            }, {

                                value: "B",

                                label: "B-type"

                            }, {

                                value: "C",

                                label: "C-Type"

                            }],

                            show: true,

                            defaultValue: "A"

                        }

                    }

                }

            }

        },

        paint: function ($element, layout) {

            console.log(layout);

            var html = '';

            $.each(layout.kfItemsList, function(key, value) {

                    html += '<div>Item: '+ (key+1) + ' Item type: ' + value.kfType +'</div>'

                    console.log(value);

                });

            $element.html(html);

        }

    }

});

codeintegrations
Contributor
Contributor

Any update on how to implement this?