How to add multiple values for the rootpath in TouchUI path browser?

Hi

Instead of enabling multiple root paths for a path browser, you can follow this alternate approach of choosing your desired root path from a selection list in your dialog.

On the basis of this selection, the root path of the pathbrowser can be set by writing a listener as follows:

function changePath() {
    var selectElement = document.querySelector('coral-select[name="./rootPath"]'),
        inputElement = document.querySelector('input[name="./path"]'),
        span = document.querySelector('span.coral-Form-field.coral-PathBrowser');
 span.setAttribute('data-path-root', selectElement.value);
    inputElement.value = selectElement.value;
    selectElement.addEventListener('change', function() {
 inputElement.value = selectElement.value;
 span.setAttribute('data-path-root', selectElement.value);
    })
};
$(document).ready(function() {
 $(document).on("dialog-ready", function() {
        changePath();
    });
});

Keeping in mind that rootPath and path are the “name” properties for the selection list and pathbrowser respectively.

I have added screenshots for the dialog and the component for your better understanding.

Dialog structure:

Selection field properties:

Path browser properties:

Component :

Root path set as per the selection :

Hope this helps!

TechAspect Solutions