单元格中显示的Javascript Datatable限制字符数 [英] Javascript Datatable limit amount of characters shown in a cell

问题描述

我正在用Javascript创建一个DataTable，它具有以下属性：

I am creating a DataTable in Javascript, which has the following properties:

var dtable = $('.ssdatatable').DataTable({
    "lengthMenu": [[10, 25, 50, 100, 500], [10, 25, 50, 100, 500]],
    "bProcessing": true,
    "sDom": "TBflrtip",
    "bServerSide": true,
    "sAjaxSource": ajSource,
    "iDisplayLength": 25,
    "bJqueryUI": false,
    "bAutoWidth": false,
    //"bAutoLength": false,
    //"bLengthChange": false,
    "recordsFiltered": 0,
    "sPaginationType": "full_numbers",
    "bPaginate": true,
    "sServerMethod": "POST",
    "responsive": true,
    "fixedHeader": true,
    "buttons": [
            'copy', 'excel', 'pdf'
    ],
    "aoColumns": [
        //columns
    ]
});

其中一个特殊列是说明，其中包含很多文本。列的宽度是固定的，但是由于这个原因，我的行的高度超出了比例，使页面x10达到了预期的大小。

One of the particular columns is a Description, which has a LOT of text in it. The width of columns is fixed, however because of that, the height of my rows are blowing out of proportions, making page x10 of its intended size.

我的问题是： 我可以在属性中添加任何内容以使其仅显示N个字符，并且通过达到限制来达到以下效果：

|text textte...|
|     Show More|      

（我尝试注释掉选项，对我有好处）

(I tried commented out options, did do me any good)

还是我需要使用某种方法或修改CSS？

Or would I need to use some method or modify css?

推荐答案

给定的数据：

var mydt = [{ a: 1, b: 2, c: 3, d: 4 }, { a: 5, b: 6, c: 7, d: 8 }, { a: 10, b: 12, c: 13, d: 14 }];


                    $("#tbl2").DataTable({
                        columnDefs: [{ targets:[0] }],
                        data: mydt, columns: [{ data: "a" }, { data: "b" }, { data: "c" }, { data: "d" }],
                        createdRow: function (row, data, c, d) {

                         // so for each row, I am pulling out the 2nd td
                         // and adding a title attribute from the 
                        // data object associated with the row.


                            $(row).children(":nth-child(2)").attr("title", data.b)


                        },



                  and the rest

这是jfiddle https://jsfiddle.net/bindrid/wbpn7z57/7/请注意，此数据具有不同格式的数据，但可以正常工作（名字为colu mn）

here is a working one in jfiddle https://jsfiddle.net/bindrid/wbpn7z57/7/ note that this one has data in a different format but it works (on the first name column)

这篇关于单元格中显示的Javascript Datatable限制字符数的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！