web-dev-qa-db-ja.com

ExtJS 4.x：Ext.grid.Panelセルの「ダーティレコード」の赤いコーナーを無効にする方法

クライアント側の視覚効果（つまり、サーバーに何も保存されない）にのみ使用されるストアを持つExt.grid.Panel（別名gridpanel）があります。新しいモデルインスタンスを作成してストアに追加すると、グリッドに赤いコーナーが表示されます（おそらくストアの変更が保存されていないことを示しています）。

現時点では、ストアに追加する前に各レコード/モデルで.commit（）メソッドを呼び出して、グリッドの汚れたレコードの赤いコーナーを防ぎます。

レコードの「ダーティ」ステータスに関する視覚的なインジケータを表示しないようにグリッドパネルを単純に構成するより一般的な方法はありますか？

注： この同様の質問 のソリューションは、CSSを使用するか、ExtJS 3のみで動作します。ExtJS4で動作するプログラムの「設定」を見つけたいと考えています。

extjs4
34
Clint Harris

こことSenchaフォーラムでの回答に基づいて、ExtJSソースを確認した後の答えは基本的に次のとおりです。

いいえ、少なくとも4.0.7では、CSSを使用せずに赤いコーナーを表示しないようにグリッドを設定する簡単な方法はありません。

すべてのブレインストーミングと追加情報に感謝します。将来これに遭遇した人が私の質問に対する明確な「答え」を見ることができるように私はこれを投げています。

7
Clint Harris

ExtJS 4.1.1で再び機能します。 gridviewでmarkDirty configurationPropertyを使用します。

GridPanelがある場合、次のように使用します。

viewConfig:{
    markDirty:false
}

http://docs.sencha.com/ext-js/4-1/#!/api/Ext.grid.View-cfg-markDirty

61
mesx

一時的なデータのみを表すチェックボックスのあるフォームがあります。チェックボックスをオンにすると、列が汚れてしまい、セルには意味がありません。同期していない場合、他の列にはおそらくダーティマークが必要でした。 @Romanの答えに触発された私のソリューションですが、どの列を処理するかをより詳細に制御できます。

列構成で：

{
    xtype: 'checkcolumn',
    tdCls: 'no-dirty',
    dataIndex: 'selected',
    width: 50,
    text: 'Check'
},

私のCSS

.no-dirty.x-grid-dirty-cell
{
    background-image: none;
}
4
David

1つのオプションは、リモートプロキシの使用を避け、代わりにautoSync：trueでメモリプロキシを使用し、Ext.Ajax.request呼び出しを使用して手動でデータをロードすることです。

リモートプロキシは、サーバーに変更が保存されたかどうかを追跡するためにかなりハードコードされています。

サーバーに保存されているかどうかを追跡したいが、角で視覚的な表示を削除したい場合は、CSSを使用して「ダーティ」行の外観を変更します。その追跡を完全に削除する場合は、リモートプロキシを使用しないでください。

4
The Mighty Chris

できます！しかし、私にとっては汚いです。迅速なソリューションのためだけに。

.x-grid-dirty-cell {
    background-image: none;
}
3
Roman Kostenko

localStorageプロキシによってサポートされるストアを使用して、同様のセットアップを行います。このストアを使用してグリッドでダーティレコードを取得する場合、 commitChanges() （ここではExtJS 4.2.1から）を使用してストアをグリッドと同期し、それによって「ダーティ」を削除します" マーカー。

2
Steen

まあ、私は汚い記録のための解決策を持っています、

実行する手順：

  • レコードの変更されたプロパティを空のオブジェクトに設定します。

    例えばrecord.modified = {};

  • これは、extのloadRecords（）を呼び出す前に実行する必要があり、モデルまたはストア内にある場合があります（Ext.data.StoreのonProxyLoad（）メソッドをオーバーロードできます）

修正：

  • 汚れたレコードの赤いマークはグリッドから削除されます
  • 更新フロー：PUT呼び出しで変更されたフィールドのみを渡します（ダーティロードでは、すべてのフィールドを渡します）
1
exTdeV

実際には、ExtJS 4.2で検証されたプログラム（CSS以外のハック）をプログラムで修正する別の方法があります

record.modified = {};

または、より具体的には、

delete record.modified[fieldName]
1
johnwp

この質問に対する答えの例からストアの書き込みリスナーを試してください： EXT JSストアのプロキシ：リーダーとライター

0
dbrin