KnockoutJS-Nested-DataTable/index.html at master · Shailu4u/KnockoutJS-Nested-DataTable · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>KnockoutJS Nested DataTable</title>
    <link rel="stylesheet" href="bower_components/datatables/media/css/jquery.dataTables.min.css"/>
    <style>
        .col-1 { width: 20px; }
        .accordion {
            font-size: 32px;
            cursor: pointer;
            font-weight: bold;
            color: orangered;
            border: 1px solid orangered;
            border-radius: 15px;
            height: 26px;
            width: 26px;
            display: inline-block;
            text-align: center;
            line-height: 0.7;
        }
        .innerDiv { border: 1px solid #ccc; }
        .innerDiv .accordion { position: relative; top: 10px;}
        .heading { text-align: center;text-decoration: underline; margin-bottom: 20px; font-weight: normal; color: darksalmon;}
        table.dataTable tbody th, table.dataTable tbody td { text-align: center;  text-transform: capitalize;  color: navy;}
        table.dataTable thead th, table.dataTable thead td { color: limegreen;}
        .innerDiv table.dataTable thead th, table.dataTable thead td {  color: deepskyblue;}
    </style>
</head>
<body>
    <div> <h1 class="heading">Knockout JS Nested DataTables</h1> </div>

    <div style="width: 75%; margin: 0 auto;">
        <!--Nested table container-->
        <ko-nested-datatable params="
                                data: tableData,
                                outerTableConfig: outerDefaults,
                                innerTableConfig: innerDefaults">
        </ko-nested-datatable>

    </div>

<!--Referring Require JS-->
<script type="text/javascript" data-main="require.config.js" src="bower_components/requirejs/require.js"></script>

</body>
</html>