how can i add individual search box??

samiurz123

<

script>
This is my script:

var oTable;
$(document).ready(function () {
    $(".pull-right").on('click', '.glyphicon-chevron-up, .glyphicon-chevron-down', function () {
        $(this).toggleClass("glyphicon-chevron-down glyphicon-chevron-up");
    });
    //data tables
    //$('').DataTable();
    oTable = $('#player_table').dataTable({
    "bProcessing": true,
            "bServerSide": true,
            "sServerMethod": "GET",
            "sAjaxSource": site_url + "backend/dashboard/ajaxData",
            "iDisplayLength": 10,
            "aLengthMenu": [[10, 25, 50, - 1], [10, 25, 50, "All"]],
            "aaSorting": [[0, 'asc']],
            "sPaginationType": "full_numbers",
            "dom": 'T<"clear">lfrtip',
            tableTools: {
            "sRowSelect": "multi",
                    "aButtons": ["select_all", "select_none"]
            },
            "aoColumns": [
            {"bVisible": true, "bSearchable": true, "bSortable": true},
            {"bVisible": true, "bSearchable": true, "bSortable": true},
            {"bVisible": true, "bSearchable": true, "bSortable": true},
            {"bVisible": true, "bSearchable": true, "bSortable": true},
            {"bVisible": true, "bSearchable": true, "bSortable": true},
            {"bVisible": true, "bSearchable": true, "bSortable": true},
             {"bVisible": true, "bSearchable": true, "bSortable": true},
            {"bVisible": true, "bSearchable": false, "bSortable": false}]

});
//individual search box
$('#player_table tfoot th').each(function () {
var title = $('#player_table thead th').eq($(this).index()).text();
$(this).html('<input type="text" placeholder="Search ' + title + '" />');
});
table.columns().eq(0).each(function (colIdx) {
$('input', table.column(colIdx).footer()).on('keyup change', function () {
table
.column(colIdx)
.search(this.value)
.draw();
});
});