Top > SAStrutsあれこれ > Flexでグリッドとチェックボックスのコラボ


  0
  1
  2
  3
  4
  5
  6
  7
  8
  9
 10
 11
 12
 13
 14
 15
 16
 17
 18
 19
 20
 21
 22
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" applicationComplete="init();">
    
    <mx:Script source="as/AllListWithCheckBox.as" />
    
    <mx:Text width="80%" text="Tutorial: グリッド(DataGrid)とチェックボックス(CheckBox)のサンプル" fontWeight="bold" fontSize="26"/>
    <mx:DataGrid width="80%" id="dg1" editable="true">
        <mx:columns>
            <mx:DataGridColumn headerText="Check?" dataField="checked" editable="true"
                    rendererIsEditor="true"
                    itemRenderer="mx.controls.CheckBox"
                    editorDataField="selected"
                    textAlign="center"
                    />
            <mx:DataGridColumn headerText="Id" dataField="id"/>
            <mx:DataGridColumn headerText="Name" dataField="name"/>
            <mx:DataGridColumn headerText="JobType" dataField="jobType"/>
            <mx:DataGridColumn headerText="Salary" dataField="salary"/>
            <mx:DataGridColumn headerText="Department" labelFunction="departmentColumnLabelFunction"/>
            <mx:DataGridColumn headerText="Address" labelFunction="addressColumnLabelFunction"/>
        </mx:columns>
    </mx:DataGrid>
    <mx:Button x="10" y="202" label="チェックした行を表示する" click="show()"/>
</mx:Application>
Everything is expanded.Everything is shortened.
  1
  2
  3
  4
  5
  6
  7
  8
  9
 10
 11
 12
 13
 14
 15
 16
 17
 18
 19
 20
 21
 22
 23
 24
 25
 26
 27
 28
 29
 30
 31
 32
 33
 34
 35
 36
 37
 38
 39
 40
 41
 42
 43
 44
 45
 46
 47
 48
 49
 50
 51
 52
 53
 54
 55
 
 
 
 
 
 
 
 
 
-
|
|
!
 
 
-
|
|
-
|
|
|
|
-
|
!
!
 
 
-
|
!
 
 
-
|
!
 
 
-
|
!
 
 
-
|
|
|
-
-
|
!
!
|
!
// ActionScript file
import mx.collections.ArrayCollection;
import mx.controls.Alert;
import mx.rpc.events.FaultEvent;
import mx.rpc.events.ResultEvent;
 
import util.SAStrutsUtils;
 
//初期表示処理
private function init():void {
    //従業員情報リストをサーバーから取得します。
    SAStrutsUtils.post2sastruts("searchEmployee", SAStrutsUtils.REQ_FINDALL, resultHandler, faultHandler);
} 
            
// HTTPServiceが成功
private function resultHandler(e:ResultEvent):void {
    
    //サーバー側の処理結果をチェックします。
    if( e.result.result  * "success" ) {
        //dataProviderが、XMLListだとCheckBoxとの連動ができませんでした。
        //多分、XMLデータだとBool値が文字列として扱われてしまうからだと思います。
        //なので、ここではArrayに変換してからdataProviderに渡します。
        dg1.dataProvider = SAStrutsUtils.convertXMLList2Array(e.result.Content.Employee);
    } else {
        Alert.show("サーバー処理失敗\n\n理由 : " + e.result.message);
    }
}
 
// HTTPServiceでエラーが発生した
private function faultHandler(e:FaultEvent):void {
    Alert.show("HTTPService失敗\n\n理由 : " + e.fault.message);
}
 
 //DataGridのDepartmentカラムにXMLの値をバインドする
private function departmentColumnLabelFunction(item:Object, column:DataGridColumn):String {
    return item.department.name;
}
 
//DataGridのAddressカラムにXMLの値をバインドする
private function addressColumnLabelFunction(item:Object, column:DataGridColumn):String {
    return item.address.name;
}
 
//チェックされた従業員のIDを表示します。
private function show():void {
    
    var target:ArrayCollection = dg1.dataProvider as ArrayCollection;
    var delete_ids:Array = new Array();
    for each( var ele:Object in target ) {
        if( ele.checked ) {
            delete_ids.push(ele.id);
        }
    }
    Alert.show(delete_ids.toString());
}


添付ファイル: fileflex_grid_chk1_3.jpg 261件 [詳細] fileflex_grid_chk1_2.jpg 262件 [詳細] fileflex_grid_chk1_1.jpg 338件 [詳細]

リロード   新規 編集 凍結解除 差分 添付 複製 名前変更   ホーム 一覧 単語検索 最終更新 バックアップ リンク元   ヘルプ   最終更新のRSS
Last-modified: 2012-08-08 (水) 23:25:59 (2923d)