List inside of sidebar

Suite and Optimus Suite 5
#1

I have a sidebar with a list inside one of the cells. The list continues on the page and I can’t scroll up or down. How can I put a scrollbar on the list and not on the sidebar? setting the height doesn’t work.

Here is the list

let myList = new dhtmlXList({ container: "activity-permission-list", template: function (obj) { return "<input class='mycheck' type='checkbox' " + (obj.checked ? "checked" : "") + ">" + "<span class='dhx_strong'>" + obj.Name + "</span>"//add class mycheck to catch the checkbox click event and "checked" property }, height: "auto" });

is there a specific way to attach the list inside of the sidebar? I’m attaching it through html.

 this.mySidebar.cells("Security Roles").attachObject("security-roles-container");

here is the html for that

    <div id="sidebarObj"></div>
    <div class="row" id="security-roles-container">

        <div class="container">
            <div class="row">
                <div class="col">
                 </div>
            </div>
            <div class="row">
                <div class="col-xs-12 text-left text-primary text-capitalize">
                    <select id="system-roles-list"></select>
                </div>
            </div>
            <div class="row">
                <div class="col-xs-4 text-left text-primary text-capitalize">Activity</div>
            </div>
            <div class="row">
                    <div class="col-xs-4 permission-list" id="activity-permission-list"></div>
                </div>
            </div>
        </div>
#2

Please, try to use the attachList() method.
Similar to the following sample of the dhtmlxList in the layout:
dhtmlx.com/docs/products/dhtmlx … ayout.html

#3

Unfortunately that doesn’t give it a height of 80, it gives it a height and width of 100%. The height : 80 property gives it a scroll bar. How can I set the height and width?

after I initialize like this

this.activityPermissionList = sidebar.cells("Security Roles").attachList({ container: "activity-permission-list", template: function (obj) { return "<input class='mycheck' type='checkbox' " + (obj.checked ? "checked" : "") + ">" + "<span class='dhx_strong'>" + obj.Name + "</span>"//add class mycheck to catch the checkbox click event and "checked" property }, height: 80, width: 300 });

Would you like me to create a demo?