JustPaste.it

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
        <meta http-equiv="content-type" content="text/html; charset=utf-8" />
        <link rel="nofollow" type="image/ico" href="https://justpaste.it/redirect/datatablehtml/http%3A%2F%2Fwww.datatables.net%2Ffavicon.ico" />
        
        <title>DataTables example</title>
        <style type="text/css" title="currentStyle">
            @import "../../media/css/demo_page.css";
            @import "../../media/css/demo_table.css";
        </style>
        <script type="text/javascript" language="javascript" src="../../media/js/jquery.js"></script>
        <script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
        <script type="text/javascript" charset="utf-8">

           var asInitVals = new Array();
            $(document).ready(function() {
                var oTable = $('#example').dataTable( {
                    "oLanguage": {
                                "sSearch": "Search all columns:"
                            },
                    "bProcessing": true,
                    "bServerSide": true,
                    "sAjaxSource": "../server_side/scripts/server_pg_processing.php",
                    "aLengthMenu": [[25, 50, 100, -1], [25, 50, 100, "All"]],
                    "iDisplayLength": 25,
                    "bScrollInfinite": true,
                    "bScrollCollapse": true,
                    "sScrollY": "20%"
                    
                } );
                $("tfoot input").keyup( function () {
                    /* Filter on the column (the index) of this element */
                    oTable.fnFilter( this.value, $("tfoot input").index(this) );
                } );
                /*
                * Support functions to provide a little bit of 'user friendlyness' to the textboxes in
                * the footer
                */
                $("tfoot input").each( function (i) {
                    asInitVals[i] = this.value;
                } );
                
                $("tfoot input").focus( function () {
                    if ( this.className == "search_init" )
                    {
                        this.className = "";
                        this.value = "";
                    }
                } );
                
                $("tfoot input").blur( function (i) {
                    if ( this.value == "" )
                    {
                        this.className = "search_init";
                        this.value = asInitVals[$("tfoot input").index(this)];
                    }
                } );
            } );
        </script>
    </head>
    <body id="dt_example">
        <div id="container" style="width:95%">
            <div>
                DataTables zero configuration
            </div>

            <h1>Live example</h1>
            <div id="demo">
<table cellpadding="0" cellspacing="0" border="0" id="example" width="100%">
    <tfoot>
        <tr>
            <th><input type="text" name="ab" value="ab" /></th>
            <th><input type="text" name="cd" value="cd" /></th>
        </tr>
    </tfoot>
    <thead>
        <tr>
            <th>ab</th>
            <th>cd</th>

        </tr>
    </thead>
</table>
            </div>
            <div></div>

            <style type="text/css">
                @import "../examples_support/syntax/css/shCore.css";
            </style>
            <script type="text/javascript" language="javascript" src="../examples_support/syntax/js/shCore.js"></script>

        </div>
    </body>
</html>