In the DX-Admin theme of Joget's UI, one thing that you may notice is that when you click on a different category, the other categories will collapse automatically. You can see this behavior in Figure 1. This option comes as default and can't be configured within the settings. Fortunately, we can work around this issue by simply modifying the Custom Javascript.

Figure 1: Example of Collapsing Category


In order to disable this behavior, you can implement the code below in the UI Builder > Settings > Configure DX-X Admin > Advanced > Custom Javascript.

layui.use(["layer", "element", "jquery"], function () {
  $(".left-nav #nav").off("click");
  $(".left-nav #nav").on("click", "li", function (event) {
    if ($(this).children(".sub-menu").length) {
      if ($(this).hasClass("open")) {
        $(this).children(".sub-menu").stop(true, true).slideUp();
      } else {
        $(this).children(".sub-menu").stop(true, true).slideDown();

Figure 2: Implementation

Figure 3: After Implementation

Download the Sample App

  • No labels