PDA

View Full Version : gridのテキストを編集した後、加工する


ak_ext
14 Jun 2009, 8:33 PM
サンプル
http://extjs.com/deploy/dev/examples/grid/totals.html

のグリッドのRateフィールドなど編集できるテキストで
値を入力してエンターを押下した後、
入力値を加工してグリッドに表示させる事は可能でしょうか。

イベントはvalidateeditでキャッチ
ストアの該当部に別の値をセットしたのですが、
直接編集した場合は値が切り替わらず、入力した値が
そのまま出てしまいます。
直接編集してない場合は指定して変える事ができました。
Tommy1969
14 Jun 2009, 11:35 PM
質問を読む限り、renderer を指定してやれば実現できそうですが…。
ak_ext
15 Jun 2009, 12:24 AM
だと上っ面だけが変わるので、
クリックして編集状態にすると入力した値が表示されてしまうと思います。
フォーカスが外れた後、入力値そのものを変えたいです。
Tommy1969
15 Jun 2009, 1:43 AM
ふむ…。では、store の update で書き換える方法ではどうでしょう?



<html>
<head>
<link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-2.2.1/resources/css/ext-all.css" />
<script type="text/javascript" src="http://extjs.cachefly.net/builds/ext-cdn-771.js"></script>
<script type="text/javascript">
/*global Ext */
var store = new Ext.data.JsonStore({
fields:['name', 'visits', 'views'],
data: [
{name:'Jul 07', visits: 245000, views: 2450000},
{name:'Aug 07', visits: 240000, views: 2450000},
{name:'Sep 07', visits: 355000, views: 2450000},
{name:'Oct 07', visits: 375000, views: 2450000},
{name:'Nov 07', visits: 490000, views: 2450000},
{name:'Dec 07', visits: 495000, views: 2450000},
{name:'Jan 08', visits: 520000, views: 2450000},
{name:'Feb 08', visits: 620000, views: 2450000}
],
listeners: {
update: function(store, rec, ope) {
var vals = rec.getChanges();
for (key in vals) {
rec.data[key] = 'prefix-' + vals[key];
}
}
}
});

Ext.onReady(function(){
new Ext.Viewport({
items: [
new Ext.grid.EditorGridPanel({
width: 400,
height: 200,
layout: 'fit',
store: store,
sm: new Ext.grid.RowSelectionModel({singleSelect: true}),
viewConfig: {forceFit: true},
columns: [
{header:'name', dataIndex:'name', editor: new Ext.form.TextField()},
{header:'visits', dataIndex:'visits', editor: new Ext.form.TextField()},
{header:'views', dataIndex:'views', editor: new Ext.form.TextField()}
]
})
]
});
});
</script>
</head>
<body>
</body>
</html>
ak_ext
15 Jun 2009, 9:41 PM
storeに直接入れたら、できました。
たとえばストアのカラムの型がintなどで、
ある数値の時は'*'を表示したい時は、
無理ですよね。。。
レンダラーはできるけど、編集の中に*を入れると
NaNになってしまいます・・・

型をStringにするとできるのですが、
そうするとソートが正しく動かなくなります。。
ak_ext
17 Jun 2009, 6:43 PM
サンプルにソートをつけて型をintにしたのですが、
普通にテキストに*や-を入力できました。
ただdataを読込ませるとダメみたいですね・・
これはintの箱に'*'を入れようとするのでしょうがなさそうです。。