2 Replies Latest reply on Aug 12, 2009 9:07 AM by hkpadobe

    Formating Datagrid

    hkpadobe

      Hi All,

       

      I have given an example of a datagrid that I need to create. It should have 2 columns (the 1st one for the checkbox) with the 2nd one containing multiple lines to hold the the email subject heading and the email message. I believe an itemrenderer would be needed, but not sure how to implement it. If the look and feel of the datagrid can be kept the same as in the example that would be great.

       

      Thanks

       

      Jselect-email-template.gif

        • 1. Re: Formating Datagrid
          Gregory Lafrance Level 6

          I suggest using a List, not a DataGrid. This code can get you started.

           

          If this post answered your question or helped, please mark it as such.

           

          <?xml version="1.0" encoding="utf-8"?>
          <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
            width="100%" height="100%" horizontalAlign="center" verticalAlign="middle">
            <mx:Script>
              <![CDATA[
                import mx.collections.ArrayCollection;
              
                [Bindable] private var ac:ArrayCollection = new ArrayCollection([
                  {selected: false, subject: "SUBJECT ONE", message: "MESSAGE ONE"},
                  {selected: false, subject: "SUBJECT TWO", message: "MESSAGE TWO"},
                  {selected: false, subject: "SUBJECT THREE", message: "MESSAGE THREE"},
                  {selected: false, subject: "SUBJECT FOUR", message: "MESSAGE FOUR"},
                ]);
              ]]>
            </mx:Script>
            <mx:Label text="Select Email Template" fontSize="16" fontWeight="bold"/>
            <mx:List dataProvider="{ac}" width="400" height="400" borderStyle="solid"
              borderColor="0x0000FF">
              <mx:itemRenderer>
                <mx:Component>
                  <mx:HBox borderColor="0xCCCCCC" borderStyle="solid">
                    <mx:CheckBox selected="{data.selected == 'true' ? true: false}"/>
                    <mx:VBox>
                      <mx:Label text="Subject" fontSize="12" fontWeight="bold"/>
                      <mx:Text text="{data.subject}"/>
                      <mx:Label text="Message" fontSize="12" fontWeight="bold"/>
                      <mx:Text text="{data.message}"/>
                    </mx:VBox>
                  </mx:HBox>
                </mx:Component>
              </mx:itemRenderer>
            </mx:List>
          </mx:Application>

          1 person found this helpful
          • 2. Re: Formating Datagrid
            hkpadobe Level 1

            Hi Greg,

             

            That helped, Thanks.

             

            J