0

ここからjqueryプラグインDatatablesを使用しています。

問題は、本来の動作をしないことです。TableToolsに2つのボタンがあります。[すべて選択]と[なしを選択]の両方にデフォルトのコードがありますが、変更はありません。

また、行を複数選択可能にしました。これがデータテーブルの宣言のコードであり、重要なほとんどすべてのものです。

var oTable;
var gaiSelected =  [];
oTable = $('#listeLigne').dataTable({
                "sDom": 'T',
                "bJQueryUI": true,
                "sPaginationType": "full_numbers",
                "oLanguage": oLanguage,
                "bLengthChange": false,
                "iDisplayLength": -1,
                "oTableTools": {
                    "sSwfPath" : "<?= _s("js/DataTables-1.9.4/extras/TableTools/media/swf/copy_csv_xls_pdf.swf") ?>",
                    "aButtons": [
                        {
                            "sExtends":    "collection",
                            "sButtonText": "Sélection",
                            "aButtons": [ 
                                {
                                    "sExtends":    "select_all",
                                    "sButtonText": "Toutes"
                                },
                                {
                                    "sExtends":    "text",
                                    "sButtonText": "Actives"
                                },
                                {
                                    "sExtends":    "text",
                                    "sButtonText": "Inactives"
                                },
                                {
                                    "sExtends":    "text",
                                    "sButtonText": "Suspendues"
                                },
                                {
                                    "sExtends":    "select_none",
                                    "sButtonText": "Aucune"
                                }
                            ]
                        },
                        {
                            "sExtends":    "collection",
                            "sButtonText": "Sauvegarder",
                            "aButtons":    [ "csv", "xls", "pdf" ]
                        },
                        {
                            "sExtends":    "print",
                            "sButtonText": "Imprimer"
                        }
                    ]
                },
                "fnRowCallback": function( nRow, aData, iDisplayIndex ) {
                    if ( jQuery.inArray(aData[0], gaiSelected) != -1 )
                    {
                        $(nRow).addClass('row_selected');
                    }
                    return nRow;
                }
            });

$('#listeLigne tbody tr').live('click', function () {
                var aData = oTable.fnGetData( this );
                var iId = aData[0];

                if ( jQuery.inArray(iId, gaiSelected) == -1 )
                {
                    gaiSelected[gaiSelected.length++] = iId;
                }
                else
                {
                    gaiSelected = jQuery.grep(gaiSelected, function(value) {
                        return value != iId;
                    } );
                }

                $(this).toggleClass('DTTT_selected');
            } );

[すべて選択]をクリックするとすべてが選択され、[なしを選択]をクリックするとすべての選択が解除されます。ただし、それらのいくつかをクリックして選択し、[選択なし]を押しても何も起こりません。そして、[すべて選択]を押してから[なし]を選択すると、機能します。

私はデータテーブルの内部コードを調べており、Web全体からさまざまな解決策を試しました（同じ問題を抱えている人はあまり見たことがありませんが）。

必要になる可能性のあるその他の情報を要求します。あらゆる情報やヘルプに感謝します。ありがとうございました。

4

1 に答える 1

0

最後に、上記のコードを次のように置き換えました。

oTable = $('#listeLigne').dataTable({
                "sDom": 'T',
                "bJQueryUI": true,
                "sPaginationType": "full_numbers",
                "oLanguage": oLanguage,
                "bLengthChange": false,
                "iDisplayLength": -1,
                "oTableTools": {
                    "sRowSelect": "multi",
                    "sSwfPath" : "<?= _s("js/DataTables-1.9.4/extras/TableTools/media/swf/copy_csv_xls_pdf.swf") ?>",
                    "aButtons": [
                        {
                                    "sExtends":    "select_none",
                                    "sButtonText": "Aucune"
                                },
                        {
                            "sExtends":    "collection",
                            "sButtonText": "Sélection",
                            "aButtons": [ 
                                {
                                    "sExtends":    "select_all",
                                    "sButtonText": "Toutes"
                                },
                                {
                                    "sExtends":    "text",
                                    "sButtonText": "Actives"
                                },
                                {
                                    "sExtends":    "text",
                                    "sButtonText": "Inactives"
                                },
                                {
                                    "sExtends":    "text",
                                    "sButtonText": "Suspendues"
                                },
                                {
                                    "sExtends":    "select_none",
                                    "sButtonText": "Aucune"
                                }
                            ]
                        },
                        {
                            "sExtends":    "collection",
                            "sButtonText": "Sauvegarder",
                            "aButtons":    [ "csv", "xls", "pdf" ]
                        },
                        {
                            "sExtends":    "print",
                            "sButtonText": "Imprimer"
                        }
                    ]
                }
            });

$('#listeLigne tbody tr').live('click', function () {
                var oTT = TableTools.fnGetInstance('listeLigne');
                oTT.fnSelect(this);
            } );

したがって、基本的に、最初の方法は、Google の「datatables select rows」を検索して見つかった方法を使用することで、標準的な方法を提供します。ただし、TableTools を使用しているため、違います。その場合、TableTools の API を使用する必要があります。

.live 関数は選択するだけなので完全ではないことに注意してください。

DataTables のドキュメントは非常に充実していますが、古いものや古いものを見つけるのが難しい場合があります。

于 2013-03-15T13:46:24.870 に答える