每列数据表选择框过滤器不工作

我检查了代码，控制台中没有任何错误，但它不显示在表格页脚中选择框我该如何解决这个问题，请帮助我。预先感谢您观看我的问题。并为我弱小的英语感到抱歉。每列数据表选择框过滤器不工作

数据表代码：

$(document).ready(function() { 
    $('#property').DataTable({ 
     initComplete: function() { 
      this.api().columns().every(function() { 
       var column = this; 
       var select = $('<select><option value=""></option></select>') 
        .appendTo($(column.footer()).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>') 
       }); 
      }); 
     } 
    }); 
});

HTML代码：

<table class="display table dataTable table-bordered table-striped" id="property" cellspacing="0" width="100%"> 
    <thead> 
    <tr> 
     <th style="font-style: uppercase;color:red;">ID</th> 
     <th style="font-style: uppercase;color:red;">PROPERTY FOR</th> 
     <th style="font-style: uppercase;color:red;">PROPERTY TYPE</th> 
     <th style="font-style: uppercase;color:red;">BHK</th> 
     <th style="font-style: uppercase;color:red;">RENT AMOUNT</th> 
     <th style="font-style: uppercase;color:red;">SELL AMOUNT</th> 
     <th style="font-style: uppercase;color:red;">LOCALITY</th> 
     <th style="font-style: uppercase;color:red;">AREA</th> 
     <th style="font-style: uppercase;color:red;">SOCITEY</th> 
     <th style="font-style: uppercase;color:red;">OWNER TYPE</th> 
     <th style="font-style: uppercase;color:red;">NAME</th> 
     <th style="font-style: uppercase;color:red;">CONTACT</th> 
     <th style="font-style: uppercase;color:red;">MONTH</th> 
     <th style="font-style: uppercase;color:red;">ACTION</th> 
    </tr> 
    </thead> 
    <tbody> 
    <?php foreach($datas as $data):?> 
    <tr class="gradeX"> 
     <td style="color:#000;font-size:15px"><?php echo $data['ID'];?></td> 
     <td style="color:#000;font-size:15px"><?php if($data['Property_for'] == 1){echo 'Sell';}else{echo 'Rent';} ?></td> 
     <td style="color:#000;font-size:15px"><?php echo $data['Property_name'];?></td> 
     <td style="color:#000;font-size:15px"><?php echo $data['BHK'];?></td> 
     <td style="color:#000;font-size:15px"><?php echo $data['Monthly_rent'];?></td> 
     <td style="color:#000;font-size:15px"><?php echo $data['Sellprice'];?></td> 
     <td style="color:#000;font-size:15px"><?php echo $data['Area'];?></td> 
     <td style="color:#000;font-size:15px"><?php echo $data['Builtup'].' '.$data['Unit_name'];?></td> 
     <td style="color:#000;font-size:15px"><?php echo $data['Socitey'];?></td> 
     <td style="color:#000;font-size:15px"><?php echo $data['Owner_Type'];?></td> 
     <td style="color:#000;font-size:15px"><?php echo $data['Owner_name'];?></td> 
     <td style="color:#000;font-size:15px"><?php echo $data['Owner_Mobile'];?></td> 
     <td style="color:#000;font-size:15px"><?php echo date("M", strtotime($data['Create_date']));?></td> 
     <td><button type="button" class="btn btn-danger btn-xs" data-toggle="modal" id="<?php echo $data['ID']?>" onClick="deleteproperty(this.id)"><i class="icon-trash"></i></button><?php if($view == 'Close'):?><button type="button" class="btn btn-danger btn-xs" data-toggle="modal" id="<?php echo $data['ID']?>" onClick="openproperty(this.id)"><i class="icon-expand-alt"></i></button><?php else:?><button type="button" class="btn btn-danger btn-xs" data-toggle="modal" id="<?php echo $data['ID']?>" onClick="closeproperty(this.id)"><i class="icon-remove"></i></button><?php endif;?><a href="http://www.kakaproperty.com/View/Property/<?php echo $data['ID']?>"><button type="button" class="btn btn-danger btn-xs"><i class="icon-expand"></i></button></a></td> 
    </tr> 
    <?php endforeach;?> 
    </tbody> 
</table>

来源

2017-05-06 shah rushabh

你需要有一个tfoot元素在您的标记。

请参阅this example的代码和演示。

来源

2017-05-06 15:29:40

每列数据表选择框过滤器不工作

回答

相关问题