Search Flex Samples

Using a Flex TextArea control as a drop-in item editor

The following example shows how you can use the Flex TextArea control as a drop-in item editor to allow you to easily edit the items in a DataGrid control.




<?xml version="1.0" encoding="utf-8"?>

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"

layout="vertical"

verticalAlign="middle"

backgroundColor="white">

<mx:XML id="itemsXML" source="data/items.xml" />

<mx:DataGrid id="dataGrid"

dataProvider="{itemsXML.item}"

variableRowHeight="true"

editable="true"

width="100%"

height="100%">

<mx:columns>

<mx:DataGridColumn id="idColumn"

dataField="@id"

editable="false"

headerText="ID" />

<mx:DataGridColumn id="descColumnTextInput"

dataField="@desc"

editable="true"

wordWrap="true"

headerText="Desc (TextInput)" />

<mx:DataGridColumn id="descColumnTextArea"

dataField="@desc"

editable="true"

wordWrap="true"

itemEditor="mx.controls.TextArea"

editorUsesEnterKey="true"

headerText="Desc (TextArea)" />

</mx:columns>

</mx:DataGrid>



</mx:Application>

items.xml


<?xml version="1.0" encoding="utf-8"?>

<items>

<item id="1" desc="The quick brown fox jumped over the lazy dog." />

<item id="2" desc="Lorem ipsum dolor sit amet, consectetuer adipiscing elit." />

<item id="3" desc="Pellentesque nonummy aliquet metus." />

<item id="4" desc="Nullam enim." />

<item id="5" desc="Nullam sollicitudin sodales diam." />

<item id="6" desc="Praesent quis tellus vel erat tristique placerat." />

<item id="7" desc="Sed egestas, enim a convallis auctor, nisl tellus tincidunt nibh, vitae tempus mauris risus at arcu." />

<item id="8" desc="Suspendisse laoreet sem eget ipsum porta consequat." />

<item id="9" desc="Ut imperdiet felis quis orci." />

<item id="10" desc="Phasellus tempus ante eu nisl." />

<item id="11" desc="Donec velit sem, rutrum ac, bibendum sed, mattis ac, odio." />

<item id="12" desc="Fusce mauris turpis, vehicula nec, mattis et, dapibus quis, arcu." />

<item id="13" desc="Morbi tincidunt volutpat justo." />

<item id="14" desc="Nam urna." />

<item id="15" desc="Mauris est dui, aliquet at, venenatis tempus, eleifend a, pede." />

<item id="16" desc="Vestibulum porttitor arcu sit amet nulla." />

<item id="17" desc="Nulla vitae sapien." />

</items>

0 comments:

Related Flex Samples

Learn Flex: Flex Samples | Flex Video Tutorials Flex Examples