3

jqGrid treegridを使用していて、セル内のデータの値（整数）に基づいて列のバックカラーをフォーマットしたい：

カラムを設定する例を次に示します。

             {
                 name: 'missingBooks',
                 cellattr: function (rowId, tv, rawObject, cm, rdata) {

                 //conditional formatting
                     if (rawObject[11] > 0) {
                         return 'style="background-color:#FFCCCC"';
                     }
                 },
                 width: 75,
                 unformat: originalValueUnFormatter,
                 formatter: missingBooksFormatter,
                 align: "right",
                 index: 'missingBooks',
                 hidden: false,
                 sorttype: 'int',
                 sortable: true
             },

これは正常に機能しますが、私の問題はcellAttrコールバックにあります。この条件付き書式行では、次のようになります。

      if (rawObject[11] > 0) {
                         return 'style="background-color:#FFCCCC"';
                     }

このロジックを再利用したいので、rawObjectにインデックスを付けて、使用している列を把握する必要はありません。私はこのようなことをする方法があることを望んでいました：

       if (rawObject.missingBooks > 0) {
                         return 'style="background-color:#FFCCCC"';
                     }

しかし、これは未定義のようです。このように、新しい列を追加した場合、この条件付き書式コードのすべてのインデックスを再作成する必要はありません。

4

1 に答える 1

2

私は問題を理解しています。Tony に、jqGrid コードにいくつかの変更を加えるよう提案しました。ほとんどの場合、コード内の場所を変更して最初に入力rdし、次に for ループ呼び出しaddCellでrd追加のパラメーターとして使用するだけで十分です。関数addCellは情報を転送し、必要に応じてまったく同じ形式の情報を持つ追加のパラメーターを使用しformatColてformatCol呼び出すことができます。cellattrrd

それでも、jqGrid コードを変更しなくても、必要なほぼ同じ結果を比較的簡単に得ることができます。rawObjectこれを行うには、名前に基づいて列のインデックスを提供できるマップ オブジェクトを作成するだけです。

たとえば、マップがまだ塗りつぶされていない場合は、beforeRequestorを使用してマップを塗りつぶすことができます。beforeProcessingコードは次のようになります

var colMap = {};
$("#tree").jqGrid({
    ...
    colModel: [
        {name: 'missingBooks',
            cellattr: function (rowId, tv, rawObject, cm, rdata) {
                //conditional formatting
                 if (Number(rawObject[colMap.missingBooks]) > 0) {
                     return ' style="background-color:#FFCCCC"';
                 } else {
                     return '';
                 }
            }
            ...
    ],
    beforeRequest: function () {
        if ($.isEmptyObject(colMap)) {
            var i, cmi,
                cm = $(this).jqGrid('getGridParam', 'colModel'),
                l = cm.length;
            for (i = 0; i < l; i++) {
                cmi = cm[i];
                colMap[cmi.name] = i;
            }
        }
    }
});

したがって、コードを変更した後rawObject[11]にインデックス11を変更できる場合のように、コードはインデックスの使用から解放されます。

対応するデモはこちらでご覧いただけます。

于 2012-01-07T23:51:18.643 に答える