DataTables

        <div id="signinTab" class="tb-cell">
            <ul>
                <li><a href="#signinList">Sign-in</a></li>
            </ul>
            <div id="signinList">
                <table id="signinTable" class="display">
                    <thead>
                        <tr>
                            <th>card#</th>
                            <th>skills</th>
                            <th>full name?!</th>
                        </tr>
                    </thead>
                </table>
            </div>
        </div>

    jqrfyWSignin($("#signinTable"), {
        "sScrollY": "300px",
        "bPaginate": false,
        "bAutoWidth": false,
        "bLengthChange": true,
        "bServerSide": true,
        "sAjaxSource": "/WorkerSignin/AjaxHandler",
        "oLanguage": datatable_lang_@(CI.TwoLetterISOLanguageName),
        "bProcessing": true,
        "aoColumns": [
            {"mDataProp": "dwccardnum", "sWidth": "3em"},
            {"mDataProp": "skills", "sWidth": "3em"},
            {"mDataProp": "fullname", "sWidth": "3em"}
        ],
        "fnServerData": function ( sSource, aoData, fnCallback ) {
			/* Add some extra data to the sender */
			aoData.push( { "name": "todaysdate", "value": $('#todaysdate').val() } );
            aoData.push( { "name": "dwccardnum", "value": $('#dwccardnum').val()} );
            aoData.push( { "name": "wa_grouping", "value": $('#wa_grouping').val()} );
            aoData.push( { "name": "typeofwork_grouping", "value": $('#typeofwork_grouping').val()} );            
			$.getJSON( sSource, aoData, function (json) { 
				/* Do whatever additional processing you want on the callback, then tell DataTables */
				fnCallback(json)
			} );
		},
        "fnRowCallback": function (nRow, aData, iDisplayIndex, iDisplayIndexFull) {
            $(nRow).attr('requestedID', aData['WSIID']);
            //alert(aData['WID'] + "-" + aData['WSIID']);
            if (aData['WAID'] > 0) { // green
                $(nRow).addClass('statusGreen');
            }                
            return nRow;
        } 
    });

function jqrfyWSignin(myTable, myOptions) {
    var oTable;
    oTable = $(myTable).dataTable(myOptions).fnSetFilteringDelay(400);
    $(myTable).find('tbody').click(function (event) {
        $(oTable.fnSettings().aoData).each(function () {
            $(this.nTr).removeClass('row_selected');
        });
        $(event.target.parentNode).addClass('row_selected');

    });
    $(myTable).find('tbody').dblclick(function (event) {
        $('#dwccardnum').val($(event.target.parentNode).find('td:first').text());
        $("#availAssignTable").dataTable().fnDraw();
    });
}