- When sidebar was showing, the tabbar was not when I am not using layout.
- When I using layout both not showing at all.
- The picture shown the layout I need. Please assist.
source:
ECO Office <link rel="stylesheet" href="codebase/suite.css?v=6.4.2">
<link rel="stylesheet" href="common/index.css?v=6.4.2">
<link rel="stylesheet" href="layout/common/layout.css?v=6.4.2">
<link rel="stylesheet" href="layout/common/sidebar.css?v=6.4.2">
<link rel="stylesheet" href="tabbar/common/index.css?v=6.4.2">
<link rel="stylesheet" href="window/common/index.css?v=6.4.2">
<!-- custom sample head -->
<link href="https://cdnjs.cloudflare.com/ajax/libs/MaterialDesign-Webfont/4.4.95/css/materialdesignicons.css?v=6.4.2" media="all" rel="stylesheet" type="text/css">
<style>
/* important to set width/height to 100% for fullscreen init */
html, body {
width: 100%;
height: 100%;
margin: 0px;
padding: 0px;
overflow: hidden;
}
.dhx_sample-container {
width: 800px;
}
.dhx_layout-cell-content {
width: 800px;
height: 450px;
}
</style>
</head>
<body>
<header class="dhx_sample-header">
<div class="dhx_sample-header__main">
<div style="color:#ffffff;width:280px;padding-right:10px;">Company Logo Here</div>
<div style="color:#ffffff;text-align:center;width:100px;"><a href="#" tooltips="Logout" style="color:#ffffff;text-decoration:none !important;" onclick="toggle()"><span class="mdi mdi-menu"></span></a></div>
<div style="color:#ffffff;text-align:right;width:100%;padding-right:10px;">
<div class="dhx_input__wrapper"><div class="dhx_input__container">
<div class="dhx_input__icon dxi dxi-magnify"></div>
<input id="txtsearch" placeholder="Search" name="txtsearch" class="dhx_input dhx_input--icon-padding" autocomplete="on">
</div>
</div>
</div>
<div style="color:#ffffff;text-align:right;width:350px;padding-right:10px;">Welcome, user |</div>
<div style="color:#ffffff;text-align:center;width:150px;"><a href="#" tooltips="Logout" style="color:#ffffff;text-decoration:none !important;">Logout <span class="mdi mdi-logout-variant"></span></a></div>
</div>
</header>
<section class="dhx_sample-container">
<div class="dhx_sample-container__widget" id="layout"></div>
</section>
<script>
var layout = new dhx.Layout("layout", {
width: "100%",
height: "100%",
css: "dhx_layout-cell--bordered",
cols: [
{
padding: 0,
id: "sidebar",
width: "50%",
},
{
padding: 0,
id: "content",
width: "50%"
}
]
});
//SIDEBAR
mainSidebar_desktop = new dhx.Sidebar("sidebar", {
css: "dhx_widget--border_right"
});
mainSidebar_desktop.data.load("sidebar/common/struct.json");
//TABBAR
var tabbar = new dhx.Tabbar("tabbar", {
mode: "top",
css: "dhx_widget--bordered",
views:[
{ tab: "Vilnius", html: "<div><p style='font-size: 18px; line-height: 1.6; padding-left: 20px; padding-right: 20px'><strong>Vilnius(Lithuanian pronunciation: [ˈvʲɪlʲnʲʊs]</strong> , see also other names) is the capital of Lithuania and its largest city, with a population of 574,147 as of 2018. Vilnius is in the southeast part of Lithuania and is the second largest city in the Baltic states. Vilnius is the seat of the main government institutions of Lithuania and the Vilnius District Municipality.</p></div>"},
{ tab: "Paris", html: "<div><p style='font-size: 18px; line-height: 1.6; padding-left: 20px; padding-right: 20px'><strong>Paris (French pronunciation: [paʁi]</strong> is the capital and most populous city of France, with an area of 105 square kilometres (41 square miles) and an official estimated population of 2,140,526 residents as of 1 January 2019. Since the 17th century, Paris has been one of Europe's major centres of finance, diplomacy, commerce, fashion, science, as well as the arts. The City of Paris is the centre and seat of government of the Île-de-France, or Paris Region, which has an estimated official 2019 population of 12,213,364, or about 18 percent of the population of France.</p></div>"},
{ tab: "London", html: "<div><p style='font-size: 18px; line-height: 1.6; padding-left: 20px; padding-right: 20px'><strong>London</strong> is the capital and largest city of both England and the United Kingdom, as well as the largest city within the European Union. Standing on the River Thames in the south-east of England, at the head of its 50-mile (80 km) estuary leading to the North Sea, London has been a major settlement for two millennia. Londinium was founded by the Romans</p></div>"},
{ tab: "Rome", html: "<div><p style='font-size: 18px; line-height: 1.6; padding-left: 20px; padding-right: 20px'><storng>Rome (Latin and Italian: Roma [ˈroːma]</storng> is the capital city and a special comune of Italy (named Comune di Roma Capitale). Rome also serves as the capital of the Lazio region. With 2,872,800 residents in 1,285 km2 (496.1 sq mi), it is also the country's most populated comune. It is the fourth most populous city in the European Union by population within city limits. It is the centre of the Metropolitan City of Rome, which has a population of 4,355,725 residents, thus making it the most populous metropolitan city in Italy.</p></div>"}
]
});
function attachList() {
layout.getCell("sidebar").attach(mainSidebar_desktop);
}
function attachDataView() {
layout.getCell("content").attach(tabbar);
}
function toggle() {
mainSidebar_desktop.toggle();
}
</script>
</body>