首页 > 代码库 > treegrid

treegrid

2024-10-07 04:21:02   218人阅读

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta name="description" content="">
        <meta name="author" content="">
      

        <title>TreeGrid for Bootstrap 3.0.x</title>
        <!-- jQuery -->        
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
        <!-- Bootstrap core CSS -->
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
        <!-- treegrid -->    
        <script type="text/javascript" src="js/jquery.treegrid.js"></script>
        <script type="text/javascript" src="js/jquery.treegrid.bootstrap3.js"></script>
        <link rel="stylesheet" href="css/jquery.treegrid.css">
        <script type="text/javascript">
            $(document).ready(function() {
                $(‘.tree‘).treegrid();
                $(‘.tree-2‘).treegrid({
                    expanderExpandedClass: ‘glyphicon glyphicon-minus‘,
                    expanderCollapsedClass: ‘glyphicon glyphicon-plus‘
                });
            });
        </script>       
    </head>
    
    <body>
        <div class="container">
           
            <h3>Overview</h2>
         <table class="table tree table-hover table-condensed table-responsive">
              <thead>
                <tr>
                    <th>Project</th>
                    <th>Total # </th>
                    <th>Manual # </th>
                </tr>
            </thead>
                <tr class="treegrid-1">
                    <td>Prime Wire</td>
                    <td>2796</td>
                    <td>Manual</td>
                </tr>
                <tr class="treegrid-2 treegrid-parent-1">
                    <td>01 - EQ Wire_CV Client GUI</td>
                    <td>2796</td>
                    <td>Manual</td>
                </tr>
                <tr class="treegrid-3 treegrid-parent-1">
                    <td>02 - EQ Wire_MO GUI</td>
                    <td>2796</td>
                    <td>Manual</td>
                </tr>
                <tr class="treegrid-4 treegrid-parent-3">
                    <td>QC-6538 Pre Advices / Deposits both displayed to clients in CV_to sync up with Dev</td>
                    <td>2796</td>
                    <td>Manual</td>
                </tr>
                <tr class="treegrid-5">
                    <td>Prime Finance Portal</td>
                    <td>2796</td>
                    <td>Manual</td>
                </tr>
                <tr class="treegrid-6 treegrid-parent-5">
                    <td>New UI</td>                    
                    <td>2796</td>
                    <td>Manual</td>
                </tr>
                <tr class="treegrid-9 treegrid-parent-6">
                    <td>Queries</td>        
                    <td>2796</td>
                    <td>Manual</td>
                </tr>  
                <tr class="treegrid-7 treegrid-parent-5">
                    <td>REGRESSION</td>                    
                    <td>2796</td>
                    <td>Manual</td>
                </tr>
                <tr class="treegrid-8 treegrid-parent-7">
                    <td>PF- Account Entitlement Validation</td>        
                    <td>2796</td>
                    <td>Manual</td>
                </tr>        
 
            </table>    

            <h3>Automation Matrix</h2>
            <table class="table tree-2 table-bordered table-striped table-condensed">
                <tr class="treegrid-1">
                    <td>Root node 1</td><td>Additional info</td>
                </tr>
                <tr class="treegrid-2 treegrid-parent-1">
                    <td>Node 1-1</td><td>Additional info</td>
                </tr>
                <tr class="treegrid-3 treegrid-parent-1">
                    <td>Node 1-2</td><td>Additional info</td>
                </tr>
                <tr class="treegrid-4 treegrid-parent-3">
                    <td>Node 1-2-1</td><td>Additional info</td>
                </tr>
                <tr class="treegrid-5">
                    <td>Root node 2</td><td>Additional info</td>
                </tr>
                <tr class="treegrid-6 treegrid-parent-5">
                    <td>Node 2-1</td><td>Additional info</td>
                </tr>
                <tr class="treegrid-7 treegrid-parent-5">
                    <td>Node 2-2</td><td>Additional info</td>
                </tr>
                <tr class="treegrid-8 treegrid-parent-7">
                    <td>Node 2-2-1</td><td>Additional info</td>
                </tr>        
            </table>    
        <!-- Bootstrap core JavaScript
        ================================================== -->
        <!-- Placed at the end of the document so the pages load faster -->
    </body>
</html>

 

treegrid


联系
我们