6/24/11

Tooltip next to the Column in Datagrid

Hi All ,  In datagrid the tooltip will be displayed over the values .In order to show the tooltip at the right or without hiding the original value in the grid we shall use item renderer concept. Here is a simple example of that.

<mx:DataGrid width="99%" rowCount="10" id="queueList" itemClick="getid(event)" dataProvider="{planListValue.children()}" draggableColumns="false" styleName="DataGridStyle" left="5"
                             top="4" right="5">
                    <mx:columns>
                        <mx:Array>
                            <mx:DataGridColumn headerText="Item Name" dataField="@itemname" showDataTips="true">
                                <mx:itemRenderer>
                                    <mx:Component>
                                        <mx:Label>
                                            <mx:Script>
                                                <![CDATA[
                                                    import mx.controls.Alert;


                                                    override public function set data(value:Object):void
                                                    {
                                                        super.data=value;
                                                        this.toolTip=value.@itemname;
                                                        this.selectable=true;
                                                        super.invalidateDisplayList();
                                                    }
                                                ]]>
                                            </mx:Script>
                                        </mx:Label>
                                    </mx:Component>
                                </mx:itemRenderer>
                            </mx:DataGridColumn>
                            <mx:DataGridColumn headerText="Type" dataField="@type" showDataTips="true" width="100">
                                <mx:itemRenderer>
                                    <mx:Component>
                                        <mx:Label>
                                            <mx:Script>
                                                <![CDATA[
                                                    import mx.controls.Alert;


                                                    override public function set data(value:Object):void
                                                    {
                                                        super.data=value;
                                                        this.toolTip=value.@type;
                                                        this.selectable=true;
                                                        super.invalidateDisplayList();
                                                    }
                                                ]]>
                                            </mx:Script>
                                        </mx:Label>
                                    </mx:Component>
                                </mx:itemRenderer>
                            </mx:DataGridColumn>
                            <mx:DataGridColumn headerText="Plan" dataField="@planname" width="100" showDataTips="true">
                                <mx:itemRenderer>
                                    <mx:Component>
                                        <mx:Label>
                                            <mx:Script>
                                                <![CDATA[
                                                    import mx.controls.Alert;


                                                    override public function set data(value:Object):void
                                                    {
                                                        super.data=value;
                                                        this.toolTip=value.@planname;
                                                        this.selectable=true;
                                                        super.invalidateDisplayList();
                                                    }
                                                ]]>
                                            </mx:Script>
                                        </mx:Label>
                                    </mx:Component>
                                </mx:itemRenderer>
                            </mx:DataGridColumn>
                            <mx:DataGridColumn headerText="Generation Date" width="150" dataField="@generationdate" headerWordWrap="true" showDataTips="true">
                                <mx:itemRenderer>
                                    <mx:Component>
                                        <mx:Label>
                                            <mx:Script>
                                                <![CDATA[
                                                    import mx.controls.Alert;


                                                    override public function set data(value:Object):void
                                                    {
                                                        super.data=value;
                                                        this.toolTip=value.@generationdate;
                                                        this.selectable=true;
                                                        super.invalidateDisplayList();
                                                    }
                                                ]]>
                                            </mx:Script>
                                        </mx:Label>
                                    </mx:Component>
                                </mx:itemRenderer>
                            </mx:DataGridColumn>
                            <mx:DataGridColumn headerText="Last Printed" dataField="@lastPrinted" showDataTips="true">
                                <mx:itemRenderer>
                                    <mx:Component>
                                        <mx:Label>
                                            <mx:Script>
                                                <![CDATA[
                                                    import mx.controls.Alert;


                                                    override public function set data(value:Object):void
                                                    {
                                                        super.data=value;
                                                        this.toolTip=value.@lastPrinted;
                                                        this.selectable=true;
                                                        super.invalidateDisplayList();
                                                    }
                                                ]]>
                                            </mx:Script>
                                        </mx:Label>
                                    </mx:Component>
                                </mx:itemRenderer>
                            </mx:DataGridColumn>
                            <mx:DataGridColumn headerText="Item Id" dataField="@itemid" visible="false" showDataTips="true">
                                <mx:itemRenderer>
                                    <mx:Component>
                                        <mx:Label>
                                            <mx:Script>
                                                <![CDATA[
                                                    import mx.controls.Alert;


                                                    override public function set data(value:Object):void
                                                    {
                                                        super.data=value;
                                                        this.toolTip=value.@itemid;
                                                        this.selectable=true;
                                                        super.invalidateDisplayList();
                                                    }
                                                ]]>
                                            </mx:Script>
                                        </mx:Label>
                                    </mx:Component>
                                </mx:itemRenderer>
                            </mx:DataGridColumn>
                            <mx:DataGridColumn headerText="plantype" dataField="@plantype" visible="false" showDataTips="true">
                                <mx:itemRenderer>
                                    <mx:Component>
                                        <mx:Label>
                                            <mx:Script>
                                                <![CDATA[
                                                    import mx.controls.Alert;


                                                    override public function set data(value:Object):void
                                                    {
                                                        super.data=value;
                                                        this.toolTip=value.@plantype;
                                                        this.selectable=true;
                                                        super.invalidateDisplayList();
                                                    }
                                                ]]>
                                            </mx:Script>
                                        </mx:Label>
                                    </mx:Component>
                                </mx:itemRenderer>
                            </mx:DataGridColumn>
                            <mx:DataGridColumn headerText="cron" dataField="@cronid" visible="false" showDataTips="true">
                                <mx:itemRenderer>
                                    <mx:Component>
                                        <mx:Label>
                                            <mx:Script>
                                                <![CDATA[
                                                    import mx.controls.Alert;


                                                    override public function set data(value:Object):void
                                                    {
                                                        super.data=value;
                                                        this.toolTip=value.@cronid;
                                                        this.selectable=true;
                                                        super.invalidateDisplayList();
                                                    }
                                                ]]>
                                            </mx:Script>
                                        </mx:Label>
                                    </mx:Component>
                                </mx:itemRenderer>
                            </mx:DataGridColumn>
                        </mx:Array>
                    </mx:columns>
                </mx:DataGrid>

No comments:

Post a Comment

Popular Posts