Kendo

by Vincent Dagpin

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2021.2.511/styles/kendo.common.min.css">
<script src="https://kendo.cdn.telerik.com/2021.2.511/js/kendo.ui.core.min.js"></script>
    <ul id="panelbar">
      <li>
          Test 1
          <div></div>
      </li>
      <li>
          Test 2
          <div></div>
      </li>
    </ul>

<br />

<ul id="panelbar2"></ul>

JavaScript

$("#panelbar").kendoPanelBar({
  expandMode: "single",
  contentUrls: [
    'https://60aafc0c66f1d0001777351c.mockapi.io/GetReleaseContent/1',
    'https://60aafc0c66f1d0001777351c.mockapi.io/GetReleaseContent/2'
  ]
});

$("#panelbar2").kendoPanelBar({
  dataSource: {
    data: [{
      text: 'Test 1',
      contentUrl: 'https://60aafc0c66f1d0001777351c.mockapi.io/GetReleaseContent/1'
    }, {
      text: 'Test 2',
      contentUrl: 'https://60aafc0c66f1d0001777351c.mockapi.io/GetReleaseContent/2'
    }]
  },
  dataTextField: 'text'
});