2010-10-04 60 views
2

我在Flex中有一個DataGrid,其中一列是複選框,另一列是數值。單擊複選框時,數值應該更改,如果複選框未選中,則數值應爲0;如果選中該複選框,則數值應爲預定義的最小值。這裏是我的代碼有:Flex DataGrid:根據另一個值更改值?

<mx:DataGrid x="0" y="45" width="272" height="525" dataProvider="{dp}" variableRowHeight="true" editable="true" id="equipmentDG" verticalAlign="middle">     
    <mx:columns>      

     <mx:DataGridColumn headerText="" headerStyleName="gridheader" width="20" dataField="included" editorDataField="selected" rendererIsEditor="true"> 
      <mx:itemRenderer> 
       <fx:Component> 
        <mx:CheckBox click="handleClicks(event)"> 
         <fx:Script> 
          <![CDATA[ 
          public function handleClicks(event:MouseEvent):void 
          { 
           data.included = !data.included; 

           if(data.included && data.antal == 0)  
            data.antal = data.minNo; 
           else if(!data.included) 
            data.antal = 0; 
          } 
          ]]> 
         </fx:Script> 
        </mx:CheckBox> 
       </fx:Component> 
      </mx:itemRenderer> 
     </mx:DataGridColumn> 
     <mx:DataGridColumn headerText="Antal" headerStyleName="gridheader" width="40" dataField="antal" editorDataField="value" editable="true"> 
      <mx:itemEditor> 
       <fx:Component> 

        <mx:NumericStepper stepSize="1" width="35" height="20" focusOut="numericstepper1_changeHandler(event)"> 
         <fx:Script> 
          <![CDATA[ 
          import mx.events.NumericStepperEvent; 
          override public function set data(value:Object):void 
          { 
           super.data = value; 

           if (value && value.hasOwnProperty("minNo")) 
            minimum = value.minNo; 

           if (value && value.hasOwnProperty("maxNo")) 
            maximum = value.maxNo;            
          } 

          protected function numericstepper1_changeHandler(event:Event):void 
          { 
           if(data.antal > 0) 
            data.included = true; 
           else 
            data.included = false; 
          } 

          ]]> 
         </fx:Script> 

        </mx:NumericStepper>           

       </fx:Component> 
      </mx:itemEditor> 
     </mx:DataGridColumn> 


    </mx:columns> 
</mx:DataGrid> 

數據的值更新(我可以看到它時,我關閉和打開對話框這是),但它並不在數據網格中即時更新。點擊複選框後,我怎樣才能使價值顯着改變?

回答

3

在您的數據對象中,確保在每次包含的屬性更改時觸發一個事件。在你的第二個itemRenderer中監聽事件並在屬性改變時更新值。

概念是這樣的:

在數據對象:

private var _included : Boolean; 
public function get included():Boolean{ 
return this._included; 
} 

public function set included(value:Boolean):void 
this._included = value; 
this.dispatchEvent(new Event('includedChanged'); 
} 

添加渲染你的第二個列,例如:

<mx:DataGridColumn headerText="Antal" headerStyleName="gridheader" width="40" dataField="antal" editorDataField="value" editable="true"> 
    <mx:itemRenderer> 
    <fx:Component> 
    <mx:Label dataChange="onDataChange()" > 
    <fx:Script> 
    <![CDATA[ 
     public function onDataChange():void{ 
     thistext = data['Antal']; 
     this.data.addEventListener('includedChanged',onIncludedChange); 
     } 
     public function onIncludedChange(e:Event):void{ 
     this.text = data['Antal']; 
     } 
    ]]> 
    </fx:Script> 
    </mx:Label> 
    </fx:Component> 
    </mx:itemRenderer> 
    <mx:itemEditor> 
    <fx:Component> 

    <mx:NumericStepper stepSize="1" width="35" height="20" focusOut="numericstepper1_changeHandler(event)"> 
    <fx:Script> 
     <![CDATA[ 
     import mx.events.NumericStepperEvent; 
     override public function set data(value:Object):void{ 
     super.data = value; 

     if (value && value.hasOwnProperty("minNo")) 
     minimum = value.minNo; 

     if (value && value.hasOwnProperty("maxNo")) 
      maximum = value.maxNo;            
     } 

     protected function numericstepper1_changeHandler(event:Event):void 
     { 
     if(data.antal > 0) 
      data.included = true; 
     else 
      data.included = false; 
     } 

     ]]> 
     </fx:Script> 
     </mx:NumericStepper>           
     </fx:Component> 
    </mx:itemEditor> 
    </mx:DataGridColumn> 
+0

謝謝,但這不是我需要設置的最小和最大值,它是實際值(data.antal)。它正在dataprovider中設置,但直到我重置數據網格的數據提供者時才顯示在數據網格中。 – Lizzan 2010-10-04 12:58:46

+0

代碼仍然是它應該如何工作的基本概念。既然你實際上並沒有在代碼中的任何地方顯示'antal'值,我不確定你要更新的視覺樣片 – JeffryHouser 2010-10-04 13:05:15

+0

'antal'值是數據網格第二列中顯示的值。這是我單擊複選框時不明顯更新的內容。 – Lizzan 2010-10-04 13:14:54

-1

這裏是快捷方式的做法:重新分配dataProvider。這應該強制DataGrid失效。

+0

雖然這會起作用;這是一個非常性能沉重的解決方案。 – JeffryHouser 2010-10-04 13:03:07

+0

@Flextras,是的,這是快速和骯髒。 :-) – splash 2010-10-04 13:13:24

+0

謝謝,是的,它的工作原理,我的數據提供者只能保存少於20件,所以它感覺真的太快了。但最好是,越少越好......至少當涉及到代碼時...... ;-) – Lizzan 2010-10-04 13:31:37

1

我只想標誌着安塔爾爲[可綁定]並使用dp作爲ArrayCollection。