搜索不适用于具有动态填充表的jquery数据表 [英] search is not working in jquery datatables with dynamically populated table

查看:73
本文介绍了搜索不适用于具有动态填充表的jquery数据表的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

即使表中有数据,我的数据表也不显示任何搜索结果.我正在使用jquery datatable插件.我正在动态填充某些列的数据,并创建一些列供用户稍后输入一些数据.

My datatable is not showing any search results even though data is there in table. I am using jquery datatable plugin. I am populating some column's data dynamically and creating some columns for user to input some data later on .

我正在使用以下脚本/样式表

I am using below script/stylesheets

    <script src="media/js/jquery.js"></script>
    <script type="text/javascript" src="js/jquery.min.js"></script>
    <script src="media/js/jquery.dataTables.js"></script>
    <link href="media/css/jquery.dataTables.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript" src="js/bootstrap.min.js"></script>
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <script src="extensions/Plugins/integration/bootstrap/3/dataTables.bootstrap.js"></script>
    <link rel="stylesheet" href="css/bootstrap-multiselect.css" type="text/css">
    <script type="text/javascript" src="js/bootstrap-multiselect.js"></script>
    <link rel="stylesheet" href="css/bootstrap-theme.min.css">
<script>
$(document).ready(function() {
    $('#dbResultsTable').dataTable( {
        "bJQueryUI": true,

        "sPaginationType": "full_numbers" ,

        "paging":   true,

        "ordering" : false,

        "scrollY":false,

        "autoWidth": true,

        "info":     true ,

       "lengthMenu": [[10, 25, 50, -1], [10, 25, 50, "All"]],

       "dom": '<"top"iflp<"clear">>rt<"bottom"iflp<"clear">>' 

        }

         );


        $('.companyNamesClass').multiselect({
            enableFiltering: true

        }),

           $('#dbResultsTable').on('draw.dt', function () {
            $('.companyNamesClass').multiselect({
                 enableFiltering: true,
            });
        });
    });
</script>

<!--- jsp page code here --->
    <table width="1698" cellspacing="0"  class="elements" id="dbResultsTable" >
     <thead>
       <tr bgcolor="#33FFFF">
        <th>Student</th>
        <th>BranchName</th>
        <th>Year</th>
        <th>Company</th>
        <th>Pkg</th>
      </thead>
    <tbody>
          <c:forEach var="indexMap" items="${requestScope.studentMap}">
           <tr><td><input type="textbox" value="${indexMap.key}"></td>
               <td><input type="texbox" value="${resultMap.value}"></td>
                <td>2010</td>
                <td>
                <select name="compnayNames[]"  class="companyNamesClass" multiple="multiple">
                    <option value="Apple">Apple</option>
                    <option value="Google">Goolge</option>
                    <option value="Tata">Tata</option> 
                    <option value="IBM">IBM</option>
                    <option value="Other">Others</option>
              </select>
                </td>
                    <td><input type="textbox"></td> 
            </tr>
        </c:forEach>                                                
        </tbody>

推荐答案

您在某处的标记存在问题,然后内置的类型检测失败. jQuery dataTables 应该自动识别列的类型,或者至少可以尝试识别.您正在使用<input><select>等,但是由于某种原因类型检测失败.永远记得做有效的标记!您可以像这样强制类型检测(1.10.x表示法:

I think you have a problem with your markup somewhere, and then the built-in typedetection fails. jQuery dataTables should automatically recognise the type of the columns, or at least it tries to. Yyou are using <input>s, <select>s and so on, but for some reason the type detection fails. Always remember to do valid markup! You can force the type detection like this (1.10.x notation:

$('#dbResultsTable').DataTable( {    
   ...
   columnDefs: [
       { "type": "html-string", "targets": 0 },
       { "type": "html-string", "targets": 1 } 
       //and so on
    ]
});

记住DataTable(),而不是dataTable()!一个小演示-> http://jsfiddle.net/azgcbnex/ 帮助.如果html-string不起作用,请尝试使用html.请让我知道此答案是否有效,否则请删除.我的回答是有条件的猜测,但不能确定.

Remember DataTable(), not dataTable()! a little demo -> http://jsfiddle.net/azgcbnex/ Hope it helps. If html-string doesnt work, try with html. Please let me know if this answer works, if not I delete it. My answer is a qualified guess, but cannot be sure.

这篇关于搜索不适用于具有动态填充表的jquery数据表的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆