Question

我有一个数据表js表，开始于：-

<link rel="stylesheet" href="http://cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css">

<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.19/css/jquery.dataTables.css">

<table id="demo-foo-filtering" class="table table-striped table-bordered 
toggle-circle m-b-0" style="width:100%">

               <colgroup>
                        <col style="width:5%;"/>
                        <col style="width:10%;"/>

                        <col style="width:20%;"/>
                        <col style="width:20%;"/>
                        <col style="width:10%;"/>
                        <col style="width:10%;"/>


                    </colgroup>

                   <thead class="pattern-table">
                    <tr>
                        <th></th>
                        <th>카테고리</th>

                        <th>해시(MD5)</th>
                        <th>파일명</th>
                        <!-- New UI requirement, column name changed.-->
                        <th>분석장비</th> <!-- New UI requirement, column name changed.-->
                        <th>등록일</th>
                    </tr>
                    </thead>

jQuery代码是

dtTable = $('#demo-foo-filtering').DataTable({
                ajax: {
                    url:"/secure-log/black-list/list",
                    type:"POST",
                    "data": function (d) {
                        d.perpage = $("#perpage").val();
                        d.search_source = $("#search_source").val();
                        d.search_keyword = $("#search_keyword").val();
                    }
                },
                dataFilter: function(data){
                var json = jQuery.parseJSON( data );
                json.recordsTotal = json.total;
                json.recordsFiltered = json.total;
                json.data = json.list;

                return JSON.stringify( json ); // return JSON string
            },
            "initComplete": function(settings, json){
              $('#divTotal').text("총 "+json.recordsFiltered.toLocaleString() + "건");
            },
            error: function(xhr, error, thrown) {
                alert(error);
                error(xhr, error, thrown);
            },
            dom: 'Bfrtip',
            "pagingType": "full_numbers",
            fixedHeader: true,
            "scrollY" : "700px",
            serverSide: true,
            pageLength: $("#perpage").val(),
            bLengthChange: false,
            processing: true,
            searching: false,
            sort: false,
            paging: true,
            info: false,
            deferRender: true,
            responsive: true,
            autoWidth : true,
            //select: 'single',
            "sPaginationType": "full_numbers",

            columns: [
                {
                  data:null
                },
                {
                    data : "rule_name",
                    label: "카테고리" //New UI requirement, column name changed.
                },

                {
                    data : "md5",
                    label: "유해파일(MD5)" //New UI requirement, column name changed.
                },
                {
                    data : "mal_file_name",
                    label: "파일명" //New UI requirement, column name changed.
                },
                {
                    data : "description",
                    label: "분석장비"
                },
                {
                    data : "cre_dt",
                    label: "등록일"
                }
            ],
            columnDefs : [
                {
                    targets : 0,

                    render : function (data, type, row, meta) {

                        var btnHtml = "<input type='checkbox' name='dtSelector' value='"+ meta.row + "'/>";

                        return btnHtml;
                    }
                }



            ]




    }
}

此代码从服务器检索数据，并在屏幕上很好地显示数据。但是，如果我在表中再增加一列，就会出现问题。此列包含很长的字符串URL。

添加时，最后三列为display:none，并且表行也不显示。我一直在尝试很多事情，例如重新调整宽度％，使隐藏的列在列defs中可见。

我猜想是否可以调整此特殊的列宽，并使大字符串显示为多行而不是单行。此问题将得到解决。你有解决的主意吗？

如果您需要我在处理问题时更加具体，请告诉我。

好餐桌

在我添加具有大字符串值的URL列之后

Answer 1

我在修剪了较大的URL字符串变量后对其进行了整理。如果你们还有其他想法如何避免这种情况。非常欢迎您回答。

添加特定列后未显示jQuery Datatable列

1 个答案: