Create a New property panel tab and add dynamic selectbox

i create a new tab name Mapping and able to create a selectbox dynamically but unable to set and get the selectbox and unable to fire the event if number selectbox more than one.

issues:
1.unable to fire event if the selectbox more than one.
2. unable to identify the tab while rendering the dynamic data i.e
domClosest(node, ‘div.bpp-properties-tab[data-tab=Mapping]’) is coming null .

function getSelected(node, id, idx) {
var selectBox = getSelectBox(node, id, idx);
return {
value: (selectBox || {}).value,
idx: (selectBox || {}).selectedIndex
};
}

function getSelectedFormField(element, node, id) {
    var selected = getSelected(element, node.parentNode, id);
    if (selected.idx === -1) {
        return;
    }
    return formHelper.getFormField(element, selected.idx);
}


function getSelectBox(node, id, idx) {
    debugger;
    var currentTab = domClosest(node, 'div.bpp-properties-tab[data-tab=Mapping]');
    var query = 'select[name=type]' + (id ? '[id=camunda-Mapping-field-' + idx + '-select]' : '');
    return domQuery(query, currentTab);
}

var i = 0;
group.entries.push(entryFactory.selectBox({
id: ‘Mapping-field-’ + i,
label: ‘properties’,
selectOptions: dataObject,
modelProperty: ‘type’,
emptyParameter: true,

        get: function (element, node) {
            var selectedFormField =  getSelectedFormField(element, node, i);
            if (selectedFormField) {
                return { type: dataObject[i] };
            } else {
                return { type: dataObject[i] };
            }
        },
        set: function (element, values, node) {
            var selectedFormField = getSelectedFormField(element, node, i),
                commands = [];

            commands.push(CmdHelper.updateBusinessObject(ModelUtil.getBusinessObject(element), selectedFormField, values));

            return commands;
        },
        hidden: function (element, node) {
            return false;
        }
    }));

please help me, i am new to this BPMN.

First, please make sure to format your code, it will help us to understand it better.

Second, please take some time to illustrate your use case a bit better. What should your new properties look like, what should it do? A sketch would help a lot.

Thanks for the replay…

propertypanel

I am able to create the property panel name : mapping
selecboxes controls will be created dynamically.

how can i set and get the selectbox values.

for populating the selectboxes
// dataObject is json to populate the dropdown value.

group.entries.push(entryFactory.selectBox({
id: ‘Mapping-field-’ + i,
label: ‘property1’,
selectOptions: dataObject,
modelProperty: ‘type’,
emptyParameter: true,
get: function (element, node) {
— error while getting the element
},
set: function (element, values, node) {
– error while setting the elements
},
hidden: function (element, node) {
return false;
}
}));

Please refer this (Dynamically change selectOptions)