4

列数が固定されていないテーブルがあります。ただし、最初の 3 列は常に存在します。

したがって、私の場合、次の属性は機能しません(そのアプローチでは列の数を固定する必要があるため)

"aoColumns": [
        {"sWidth": "50px"},
        {"sWidth": "100px"},
        {"sWidth": "100px"},
        null,
        null,
        null
    ]
 } );

私は次のようなものを試しました:

"aoColumns": [[1, { "sWidth": "50px" }] ]

いくつかのエラーが発生するため、これも機能しません。

良い方法を提案してください。

4

1 に答える 1

4

関数に -array を動的に生成させないのはなぜaoColumnsですか?

// function that generates the aoColumns-array based on the tables <thead>
// columns beyond #3 get a fixed 25px width (just to be illustrative)
// expand the switch if certain columns need certain fixed widths
function aoColumns() {
    var ao = [];
    $("#table th").each(function(i) {
        switch (i) {
            case 0 : 
                ao.push({"sWidth": "50px"});
                break;
            case 1 : 
                ao.push({"sWidth": "100px"});
                break;
            case 2 : 
                ao.push({"sWidth": "100px"});
                break;
            default :
                ao.push({"sWidth": "25px"});
                break;
        }
    });
    return ao;
}

$(document).ready(function () {
    var table = $('#table').dataTable({
        aoColumns: aoColumns()
    });
});

このアプローチを使用すると、テーブルの列数が 1、3、または 1000 であっても、データテーブルは正しく初期化されます。

インデックスではなく各列のキャプションに基づいて列幅を評価する場合は、aoColumn-function を少し変更する必要があります。

function aoColumns() {
    var ao = [];
    $("#table th").each(function(i, th) {
        var caption=$(th).text();
        switch (caption) {
            case 'A' : 
                ao.push({"sWidth": "50px"});
                break;
            case 'B' : 
                ao.push({"sWidth": "100px"});
                break;

            /*...
            and so on
            ...*/

            default :
                ao.push({"sWidth": "25px"});
                break;
        }
    });
    return ao;
}
于 2013-08-14T13:25:25.093 に答える