Bootstrap table, group-by-v2 plugin not working in example

Question

I am using JQuery Bootstrap-table, grouping data. found here: https://examples.bootstrap-table.com/#extensions/group-by-v2.html. The example given there currently shows an extra row (not found in JSON), but does not create expand-collapse icons or functionality.

Am I missing something? this is the code I am using in HTML file:

        <link href="../lib/bootstrap-table/src/extensions/group-by-v2/bootstrap-table-group-by.css" rel="stylesheet"/>
        <link href="../lib/bootstrap-table/src/bootstrap-table.css" rel="stylesheet"/>
        <link href="../lib/bootstrap-table/src/extensions/filter-control/bootstrap-table-filter-control.css" rel="stylesheet"/>
        <link rel="stylesheet" href="../lib/bootstrap4-editable/css/bootstrap-editable.css">
...
       <script type="text/javascript" src="../util/bootstrap-table.js"></script>
        <script src="../lib/bootstrap-table/src/extensions/editable/bootstrap-table-editable.js"></script>
        <script src="../lib/bootstrap-table/src/extensions/filter-control/bootstrap-table-filter-control.js"></script>
        <script src="../lib/bootstrap-table/src/extensions/group-by-v2/bootstrap-table-group-by.js"></script>

... Further down in HTML file.

                <table id="summGrid" data-toolbar="#summToolbar" data-search="true" data-show-refresh="true" data-show-toggle="true"
                data-show-fullscreen="true" data-show-columns="true" data-detail-view="false" data-show-export="true" data-click-to-select="true"
                data-group-by="true" data-group-by-field="shape"  data-url="./tree.json"
                data-pagination="true" data-filter-control="true" data-show-footer="true" data-unique-id="id" data-id-field="id">
                <thead>
                  <tr>
                    <th data-field="shape">Shape</th>
                    <th data-field="color">Color</th>
                    <th data-field="area">Area</th>
                  </tr>
                </thead>

                </table>

The Json (tree.json) is like this:

[
    {
        "id": 1,
        "shape": "triangle",
        "color": "red",
        "area": 5,
        "label": "T1"
    },
    {
        "id": 2,
        "shape": "triangle",
        "color": "green",
        "area": 27,
        "label": "T2"
    },
...

I copy pasted the whole thing from the example provided in the link above.

Answer 1

I figured out that this extension (group-by-v2) does not have this functionality. I found another extension which does this job. tree-grid extension (https://live.bootstrap-table.com/example/extensions/treegrid.html).