Filter Dropdown by User Role in Authentication

[KlisaN137]

Hello Caspians,

I just wanted to share my case:

I have a Submission Form with Authentication (users can have access levels 1,2 and 3). In it, I have a Dropdown where user can choose to which department (role) to assign the issue, but I want that each logged in user can choose department which is only on his or any lower level.

So, user which is on level 2 can see only options that have stamped on them level 2 and 1. User with level 3 can see any option with levels 1, 2 or 3.

We will need 'users' table with levels, and 'Roles' table with their mapped maximum level access::

 

In Submission Form, we will need to set up the Dropdown field as follows, as well as additional Virtual Field with Dropdown Form Element (Virtual Field will be hidden with JavaScript, but in order to hide Label, select 'No Label' from Advanced Options):

Once this is done, add another HTML block, and add the following JavaScript code in it:

<script>
document.addEventListener('DataPageReady', function(event) {
    const userLevel = '[@authfield:Level#]' // Select you own Authentication Parameter for User Level
    const dropdown = document.querySelector('select[name="InsertRecordAssigned_Departmant"]'); // Select your own Dropdown Field
    const helper = document.querySelector('select[name="cbParamVirtual1"]'); // Select Virtual Field
    helper.style.display = 'none';
    let optionsMap = [];

    const arrayHelper = Array.from(helper.querySelectorAll('option'));
    for (let el of arrayHelper) {
        optionsMap.push({
            'level': el.value,
            'type': el.textContent
        })
    }

    let getOut = [];
    for (let i = 0; i < dropdown.length; i++) {
        const find = optionsMap.find(({ type }) => type === dropdown.options[i].value)
        console.log(`find level: ${find.level}, type: ${find.type}, user_level: ${userLevel}, option: ${dropdown.options[i].value}`)
        if (Number(find.level) > Number(userLevel)) {
            getOut.push(i);
        }
    }
    getOut = getOut.reverse();
    for (let i of getOut) {
        dropdown.remove(i);
    }
});
</script>

Adjust declaring of variables at top, to select your Authentication Parameter for User Level, Dropdown Field (Just this need to be changed: const dropdown = document.querySelector('select[name="InsertRecordAssigned_Departmant"]'); ), and for Virtual field.