DataTabe grid columns are not removing after call of .draw() function.

sam101

Hi
My server side pagination is working fine. now i need to hide one or more columns depending on DOM conditions. when the dataTable load first time it hides the required columns but when we do individual search then the hide columns are showing. so i use "setTimeout": function in .draw. unfortunately it is not removing my columns. i am giving you my code below:

``` $(document).ready(function () {

        $('#promoters thead tr#filterrow th').each(function () {
            var title = $('#agents thead th').eq($(this).index()).text();
            $(this).html('<input type="text" onclick="stopPropagation(event);" placeholder="Search ' + title + '" />');
        });


       var EnrolTreeIns= $('#promoters').DataTable({
                          "bServerSide": true,
                          "sAjaxSource": "@Url.Action("......", "......")",
                          "bProcessing": true,
                         "type": "POST",
                          "pagingType": "full_numbers",
                        "sServerMethod": "POST",
                        "searchable": "true",
                        "sScrollX": "100%",
                         "bAutoWidth": false, // Disable the auto width calculation 
                          "autoWidth": false,
                         "orderCellsTop": true,
                         "overflow": "hidden",                 
                        "aoColumns": [
                                        { "sName": "PromoterId", "sClass": "hide_column" },
                                        { "sName": "EnrollDate" },
                                         { "sName": "Level" },
                                        { "sName": "First Name" },
                                        { "sName": "Last Name" },                      
                                        { "sName": "Website" }                
                          ],
                     });
                  // this section is respinsible for individual column search

                 $(".dataTable thead th input").on('keyup change', function () {

                           var newTeb=  EnrolTreeIns.column($(this).parent().index() + ':visible')
                                              .search(this.value)
                                              .draw();


                    if (newTeb != "undefined") {

                              setTimeout(function () {
                                       if ($("#promotercode").val() == "8") {
                                           $('#promoters').on('init.dt', function () {
                                           $('td:nth-child(25)').hide();
                                     });
                                  };

                                      if ($("#promotercode").val() == "7") {
                                          $('#promoters').on('init.dt', function () {
                                          $("td:nth-child(25)").remove();
                                          $('td:nth-child(26)').remove();
                                      });
                                 };
                               }, 5000);

                         };
                    });

sam101

Well eventually i found out the problem and solved it. we just need to take this line off from the setTimeout() function.
``` $('#promoters').on('init.dt', function () {}

the reason is, with draw() function dataTable initiate to create the grid and load data. setTimeout() function allow to load data. since grid is already loaded so we don't need to wait for loading again.

the 'init.dt' actually allow the dataTable to load the grid and data first and then do the job in the function which is unnecessary after the setTimeout().