2010-10-04 2 views
2

У меня есть DataGrid в Flex, с одним столбцом флажок и другое числовое значение. При щелчке по флажку числовое значение должно измениться, либо на 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, но не отображается в datagrid, пока я не сброшу dataprovider для datagrid. – Lizzan

+0

Код по-прежнему является основной концепцией того, как он должен работать. Поскольку вы фактически не показываете значение «antal» в любом месте вашего кода; Я не уверен, какой визуальный фрагмент вы пытаетесь обновить. – JeffryHouser

+0

Значение «antal» - это то, что показано во втором столбце в datagrid. Это то, что не заметно обновляется в тот момент, когда я нажимаю флажок. – Lizzan

-1

Ниже приведено подход: переустановите dataProvider. Это должно привести к аннулированию DataGrid.

+0

Хотя это будет работать; это очень эффективное решение. – JeffryHouser

+0

@ Флестрас, да, это быстро и грязно. :-) – splash

+0

Спасибо, да, это работает, и мой dataprovider вмещает менее 20 предметов, поэтому он чувствует себя очень быстро. Но лучше, меньше грязнее, лучше ... по крайней мере, когда дело доходит до кода ... ;-) – Lizzan

1

я бы просто пометить Антал, как [Bindable ] и используйте dp как ArrayCollection.

Смежные вопросы