add select inputs after server side processing

zapata

how can I add select input after server side processing? For only City Column

zapata

I solved myself

$('#clients').DataTable( {

        dom: "Bfrtip",
        ajax: {
            url: "/server-processing.php",
            type: 'POST'
        },
        columns: [
                { data: "clients.id" },
            { data: "clients.client_invoice_name" },
            { data: "clients.contact" },
            { data: "cities.city" },

        ],
        "order": [[ 0, "desc" ]],

       
        initComplete: function () {
            
            this.api().columns(3).every( function () { 
//or if you need 2 columns: this.api().columns([2,3]).every( function () {

                var column = this;
                var select = $('<select><option value=""></option></select>')
                    .appendTo( $(column.header()).empty() )
                    .on( 'change', function () {
                        var val = $.fn.dataTable.util.escapeRegex(
                            $(this).val()
                        );
 
                        column
                            .search( val ? '^'+val+'$' : '', true, false )
                            .draw();
                    } );
 
                column.data().unique().sort().each( function ( d, j ) {
                    select.append( '<option value="'+d+'">'+d+'</option>' )
                } );
            } );
        }
     
    
});