Flex Datagrid 列总计

Question

我有一个数据网格，其中包含标题、价格、数量和总计列。标题、价格和数量数据从 xml 文件加载，总数由 labelFunction 填充以将价格乘以数量。

我可以通过将字符串返回到总计列下的行来使用 labelFunction 填充每行的总计，但我无法弄清楚如何获取总计列的总计。我想获取总计并将其显示在数据网格之外的 textBox/somewhere else 中。

我可以使用 updateEsimate 函数获得总数，但它只会使用数据网格上的 itemEditEnd 发送总数（这意味着我必须单击“吃数量”行才能进行统计) 我希望它在加载后自动给我总数。

请帮忙！

（一些示例代码）

        public function updateEstimate(event:DataGridEvent):void
        {
            // TODO Auto-generated method stub

            var sum:Number = 0;

            for(var i:int=0; i<orderGrid.dataProvider.length ; i++) {

                sum += Number(orderGrid.dataProvider.getItemAt(i).total);
                totaltxt.text = sum.toString();

            }

            totaltxt.text = sum.toString();

        }




        public function getTotal(item:Object, column:DataGridColumn):String
        {


            var sum:Number = item.price * item.quantity;

            return sum.toString();


        }

    <mx:XMLListCollection id="xmlProdListColl"
                          source="{productXML.lastResult.offer}"
                          />


</fx:Declarations>
<mx:DataGrid id="orderGrid" x="44" y="0" width="640" height="155" 
             dataProvider="{xmlProdListColl}" 
             doubleClickEnabled="true" editable="true"
             itemEditEnd="orderGrid_itemEditEndHandler(event); updateEstimate(event)">
    <mx:columns>
        <mx:DataGridColumn headerText="Title" dataField="title" editable="false"/>
        <mx:DataGridColumn headerText="Price" dataField="price" editable="false"/>
        <mx:DataGridColumn headerText="Quantity" dataField="quantity"/>
        <mx:DataGridColumn headerText="Total" labelFunction="getTotal" editable="false"/>
    </mx:columns>
</mx:DataGrid>


<s:RichText id="totaltxt" width="147" height="84" fontSize="18" text=""  textAlign="center"
            verticalAlign="middle" />

Answer 1

您可以改用 XMLListCollection 上的 CollectionEvent。这将在开始时以及对数据进行任何更新时分派：

public function updateEstimate(event:CollectionEvent):void{
    // your update code
}

<mx:XMLListCollection id="xmlProdListColl"
                      collectionChange="updateEstimate(event)"
                      source="{productXML.lastResult.offer}"/>

Answer 2

据我所知，您在 getTotal() 中计算总数以显示总数，但并未在实际对象中设置 "total" 属性。它是您在 updateEstimate() 中使用的总数属性。因此，无论何时编辑数量，您仍然会在数据网格中看到正确的总数，但文本字段中的值将保持不变

我不是绑定 dataProvider 的忠实粉丝，因为您永远不知道数据何时可用并且很难修改它（就像我们在这里需要它一样）。我更喜欢我自己的 dataProvider 变量，它们是强类型的，我可以随意修改 :)

所以我会这样做：

我假设，您的 XML 看起来像这样，您没有 "total" 值：

<root>
<lastResult>
    <offer>
        <title>Title</title>
        <price>20</price>
        <quantity>1</quantity>
    </offer>
    <offer>
        <title>Title 2</title>
        <price>30</price>
        <quantity>2</quantity>
    </offer>
</lastResult>

在您的代码中的某个时刻，您将拥有 XML。这是您修改它的地方，添加总计属性并将 dataProvider 传递给网格：

private var _orderDataProvider:XMLListCollection;

private function gotData():void
{
     var list:XMLList = new XMLList(productXML.lastResult.offer);
    _orderDataProvider = new XMLListCollection(list);

    updateEstimate(); // call this before we assign the dataprovider to the grid, so we will have totals in items
    orderGrid.dataProvider = _orderDataProvider;
}

public function updateEstimate(event:DataGridEvent = null):void
{
    // update all totals in all items and the "Estimated total" in one go               
    var sum:Number = 0;

    for (var i:int = 0; i < _orderDataProvider.length; i++)
    {
        var item:Object = _orderDataProvider.getItemAt(i);
        item.total = item.quantity * item.price;
        sum += Number(_orderDataProvider.getItemAt(i).total);
    }

    totaltxt.text = sum.toString();
}

MXML:

<mx:DataGrid id="orderGrid"
             x="44"
             y="0"
             width="640"
             height="155"
             doubleClickEnabled="true"
             editable="true"
             itemEditEnd="updateEstimate(event)">

    <mx:columns>

        <mx:DataGridColumn headerText="Title"
                           dataField="title"
                           editable="false"/>

        <mx:DataGridColumn headerText="Price"
                           dataField="price"
                           editable="false"/>

        <mx:DataGridColumn headerText="Quantity"
                           dataField="quantity"/>

        <mx:DataGridColumn headerText="Total"
                           dataField="total"
                           editable="false"/>

    </mx:columns>

</mx:DataGrid>

<s:RichText id="totaltxt"
            width="147"
            height="84"
            fontSize="18"
            text=""
            textAlign="center"
            verticalAlign="middle"/>

现在如您所见，这不是理想的代码，因为我们每次编辑时都会更新所有项目的总计，尽管您只编辑一个条目，但我们不必弄乱多个函数，只要您不列表中有 1000 个条目应该没问题。

Flex Datagrid 列总计

Flex Datagrid Column Total

apache-flex

datagrid

flash-builder