﻿/**

        ----make sure the directory structure is correct
        <script type="text/javascript" src="/dir_script/jquery.js"></script>
        <script type="text/javascript" src="/dir_script/jquery.tablesorter.js"></script>
        <link rel="stylesheet" type="text/css" href="../../dir_style/tablesorter.css">


        <div class="tablesorterDiv">
            <table class="tablesorter" id="myTableID">
                <thead>
                    <tr>
                        <th class="header">ColumnName</th>
                        <th class="header">ColumnName</th>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td>Data</td>
                        <td>Data</td>
                    </tr>
                </tbody>
            </table>
        </div>

    * OR * using gridview:

        <script>
            $(document).ready(function () {
                $("#<% Response.Write(gv.ClientID) %>").tablesorter();
            }
            );
        </script>

        <div class="tablesorterDiv">
            <asp:GridView ID="myTableID" CssClass="tablesorter" runat="server"></asp:GridView>
        </div>

        gv.DataSource = dt
        gv.DataBind()
        gv.HeaderRow.TableSection = TableRowSection.TableHeader



*/

        div.tablesorterDiv{
            font: 1em Arial;
        }

        div.tablesorterDiv table {
            border-collapse: collapse;
        }

        div.tablesorterDiv table, div.tablesorterDiv th, div.tablesorterDiv td {
            border: 1px solid gray;
        }

        div.tablesorterDiv th, div.tablesorterDiv td {
            padding: 5px;
            text-align: left;
        }

        div.tablesorterDiv tr{vertical-align:top;}
        div.tablesorterDiv tr:nth-child(even) {
            background-color: #f3f3f3;
        }

        div.tablesorterDiv tr:hover {
            background-color: #cecece;
        }

        div.tablesorterDiv th {
            background-image: url(../dir_image/dir_tablesorter/bg_white.gif);
            cursor: pointer;
            font-weight: bold;
            background-repeat: no-repeat;
            background-position: center right;
            /*padding-left: 20px;*/
            border-right: 1px solid gray;
            /*margin-left: -1px;*/
            padding-right: 20px;
            background-color: #888888;
            color: white;
        }

        .acp div.tablesorterDiv th
        {background-image: none;}
.avs div.tablesorterDiv th {
	background-image: none;
}

        div.tablesorterDiv th.headerSortUp {
            background-image: url(../dir_image/dir_tablesorter/asc.gif);
            background-color: #999999;
        }

        div.tablesorterDiv th.headerSortDown {
            background-image: url(../dir_image/dir_tablesorter/desc.gif);
            background-color: #999999;
        }