how to restrict editable datagrid values in flex ??

[rajeshb_flash]

Hello Friends,

I need a small help in Flex_DataGrid.

I have a datagrid in flex and i am making the datagrid as editable. I can able to edit it and enter the values. so far so good. Now my requirement was, i want to restrict the editable datagrid cell to some max chars like 10. I mean to say maxChars = 10, i want to restrict like this & i want to implement like this. how is this possible.

i need a solution asap.

Rajesh

[cancerinform]

You create an renderer. Here is a sample script for the Datagrid:

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
               xmlns:s="library://ns.adobe.com/flex/spark" 
               xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">
    <fx:Declarations>
        <fx:Model id="itemData" source="data/numbers.xml"/>
        <s:ArrayList id="itemAC" source="{itemData.row}"/>
    </fx:Declarations>
    <mx:DataGrid id="myGrid" editable="true"
                 dataProvider="{itemAC}">
        <mx:columns>
            <mx:DataGridColumn dataField="item" headerText="Item"/>
            <mx:DataGridColumn dataField="number" headerText="Number" 
                               itemRenderer="renderers.MaxNumRenderer"/>
        </mx:columns>
    </mx:DataGrid>
</s:Application>

This is the xml file in a package called data:

<?xml version="1.0"?>
<numbers>
    <row>
        <item>xx</item>
        <number>2</number>
    </row>
    <row>
        <item>yy</item>
        <number>3</number>
    </row>
    <row>
        <item>zz</item>
        <number>4</number>
    </row>
 </numbers>

And this is the item renderer MaxNumRenderer in a package called renderers:

<?xml version="1.0" encoding="utf-8"?>
<s:MXDataGridItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009" 
                          xmlns:s="library://ns.adobe.com/flex/spark" 
                          xmlns:mx="library://ns.adobe.com/flex/mx" 
                          focusEnabled="true"
                          dataChange="updateHTML()">
    <fx:Script>
        <![CDATA[
            private function updateHTML():void
            {
                if(int(lblData.text) > 5)
                {
                    lblData.text = "5";
                }
            }
        ]]>
    </fx:Script>
    <s:Label id="lblData" top="0" left="0" right="0" bottom="0" text="{dataGridListData.label}" />
</s:MXDataGridItemRenderer>

When you now change the number and it is larger than 5, the number will automatically go back to 5.

[cancerinform]

If you want to limit the number of characters then use this in the renderer:

if(lblData.text.length > 10)
{
lblData.text = "10 is max";
}