flex4.5在DataGrid中对单元格进行验证


效果图:


flex4.5在DataGrid中对单元格进行验证
只对指定列进行验证,并显示验证结果提示信息


因为开始的时候思路不对,所以白忙活了一天,最后还是利用flex的渲染器来实现这个功能。
现在经常有这样的需求,就是从后台查询到数据时,要对数据进行增删改操作,其中还要进行数据校验。可以对某一行进行校验,也可以对这一行数据中的某一列进行校验,同时显示提示信息。

在官网上看到flex提供的例子,但是那是4.0之前的版本,而且还不是我想要的效果,我学的是flex4.5,利用组件时,flex经常会提示说某某组件在4.0版本之后建议改用成某某组件了,我是个老实的孩子呀,就按照adobe的提示,使用新的组件来开发。现在flex4.5的参考资料在网上可少,希望以后多些。

思路就是:
在DataGrid中(我用的是spark.components.DataGrid),利用flex的渲染器itemRenderer来显示需要的效果。我本来想用itemEditor,但是这个在显示时,不能覆盖父类的显示,所以我就用itemRenderer。

<s:DataGrid width="100%" height="90%"
dataProvider="{productList}" // 说明:productList是我绑定的数据
editable="true"
requestedRowCount="4"
selectionColor="#a8c6ee"
>
    <s:GridColumn headerText="产品描述" editable="false" >
        <s:itemRenderer >
            <fx:Component >
                <s:GridItemRenderer   >
                    <fx:Declarations>
                        <!-- 将非可视元素(例如服务、值对象)放在此处 -->
                        <mx:RegExpValidator source="{productDesc}" 
                        property="text"
                        expression="填写要验证的正则表达式" //
                        noMatchError="填写验证不通过时显示他提示信息"
                       />
                    </fx:Declarations>
                    <s:TextInput id="productDesc"
                     width="98%" height="98%" x="1" y="2"   > </s:TextInput>
                </s:GridItemRenderer>
            </fx:Component>
        </s:itemRenderer>
    </s:GridColumn>
</s:DataGrid>




你可能感兴趣的:(datagrid,validate,itemRenderer,itemEditor,flex渲染器,DataGrid验证)