I am using the jquery plug-in datatables.

I am using the feature, datatables-multi-filter-select on my website with php code.

I want to move the drop down filter from the footer to the header like in the following example: http://www.datatables.net/extras/thirdparty/ColumnFilterWidgets/DataTables/extras/ColumnFilterWidgets/

Can anyone please update the following PHP code sample to accomplish this?

Code:

/** * Register necessary Plugin Filters */add_filter( 'tablepress_shortcode_table_default_shortcode_atts', 'tablepress_add_shortcode_parameters_multi_filter_select' );add_filter( 'tablepress_table_render_options', 'tablepress_set_table_foot_option', 10, 2 );add_filter( 'tablepress_table_js_options', 'tablepress_add_multi_filter_select_js_options', 10, 3 );add_filter( 'tablepress_datatables_command', 'tablepress_add_multi_filter_select_js_command', 10, 5 ); /** * Add "datatables_multi_filter_select" as a valid parameter to the [table /] Shortcode */function tablepress_add_shortcode_parameters_multi_filter_select( $default_atts ) {    $default_atts['datatables_multi_filter_select'] = false;    return $default_atts;} /** * Make sure that "table_foot" and "datatables_scrollX" are false, if "datatables_multi_filter_select" is true, * as the footer will be appended by the JS. Scrolling will not work with automatically added content */function tablepress_set_table_foot_option( $render_options, $table ) {    if ( $render_options['datatables_multi_filter_select'] ) {        $render_options['table_foot'] = false;        $render_options['datatables_scrollX'] = false;    }    return $render_options;} /** * Pass "datatables_multi_filter_select" from Shortcode parameters to JavaScript arguments */function tablepress_add_multi_filter_select_js_options( $js_options, $table_id, $render_options ) {    $js_options['datatables_multi_filter_select'] = $render_options['datatables_multi_filter_select'];     // register the JS    if ( $js_options['datatables_multi_filter_select'] ) {        $suffix = ( defined( 'SCRIPT_DEBUG' ) && SCRIPT_DEBUG ) ? '' : '.min';        $js_multi_filter_select_url = plugins_url( "multi-filter-select{$suffix}.js", __FILE__ );        wp_enqueue_script( 'tablepress-multi_filter_select', $js_multi_filter_select_url, array( 'tablepress-datatables' ), '1.0', true );    }     return $js_options;} /** * Evaluate "datatables_multi_filter_select" parameter and add corresponding JavaScript code, if needed */function tablepress_add_multi_filter_select_js_command( $command, $html_id, $parameters, $table_id, $js_options ) {     if ( ! $js_options['datatables_multi_filter_select'] )        return $command;     $name = str_replace( '-', '_', $html_id );    $datatables_name = "DT_{$name}";     $command = <<<JSvar {$name} = $('#{$html_id}'),    {$datatables_name} = {$name}.dataTable({$parameters}),    {$name}_tfoot, {$name}_selects, ths = '<tfoot>';{$name}.find('thead th').each( function( i ) {    ths += '<th>' + datatables_fnCreateSelect( {$datatables_name}.fnGetColumnData(i) ) + '</th>';} );ths += '</tfoot>';{$name}_tfoot = {$name}.append(ths).find('tfoot');{$name}_selects = {$name}_tfoot.find('select');{$name}_tfoot.on( 'change', 'select', function() {    {$datatables_name}.fnFilter( $(this).val(), {$name}_selects.index(this) );} );JS;    return $command;}
(function($) {/* * Function: fnGetColumnData * Purpose:  Return an array of table values from a particular column. * Returns:  array string: 1d data array * Inputs:   object:oSettings - dataTable settings object. This is always the last argument past to the function *           int:iColumn - the id of the column to extract the data from *           bool:bUnique - optional - if set to false duplicated values are not filtered out *           bool:bFiltered - optional - if set to false all the table data is used (not only the filtered) *           bool:bIgnoreEmpty - optional - if set to false empty values are not filtered from the result array * Author:   Benedikt Forchhammer <b.forchhammer /AT\ mind2.de> */$.fn.dataTableExt.oApi.fnGetColumnData = function ( oSettings, iColumn, bUnique, bFiltered, bIgnoreEmpty ) {    // check that we have a column id    if ( typeof iColumn == "undefined" ) return new Array();     // by default we only wany unique data    if ( typeof bUnique == "undefined" ) bUnique = true;     // by default we do want to only look at filtered data    if ( typeof bFiltered == "undefined" ) bFiltered = true;     // by default we do not wany to include empty values    if ( typeof bIgnoreEmpty == "undefined" ) bIgnoreEmpty = true;     // list of rows which we're going to loop through    var aiRows;     // use only filtered rows    if (bFiltered == true) aiRows = oSettings.aiDisplay;    // use all rows    else aiRows = oSettings.aiDisplayMaster; // all row numbers     // set up data array    var asResultData = new Array();     for (var i=0,c=aiRows.length; i<c; i++) {        iRow = aiRows[i];        var aData = this.fnGetData(iRow);        var sValue = aData[iColumn];         // ignore empty values?        if (bIgnoreEmpty == true && sValue.length == 0) continue;         // ignore unique values?        else if (bUnique == true && jQuery.inArray(sValue, asResultData) > -1) continue;         // else push the value onto the result data array        else asResultData.push(sValue);    }     return asResultData;}}(jQuery)); function datatables_fnCreateSelect( aData ) {    var r = '<select><option value=""></option>', i, iLen = aData.length;    for ( i=0 ; i<iLen ; i++ ) {        r += '<option value="'+aData[i]+'">'+aData[i]+'</option>';    }    return r + '</select>';}