5 Replies Latest reply on Aug 3, 2010 7:06 AM by bindu84

    tooltip

    bindu84 Level 1

      How to get the value of tootip, i have a datgrid , showdatatips is true,

       

      I need to check cell value if it is blank i dont want to show tootip.

       

      for doing that  i want to get the value of tootip if it is blank hide tooltip , how to implement it ,can anyone help me in that.

        • 1. Re: tooltip
          Matt Le Fevre Level 4

          bindu84 wrote:

           

          How to get the value of tootip, i have a datgrid , showdatatips is true,

           

          I need to check cell value if it is blank i dont want to show tootip.

           

          for doing that  i want to get the value of tootip if it is blank hide tooltip , how to implement it ,can anyone help me in that.

          could do something like this

           

          <?xml version="1.0" encoding="utf-8"?>
          <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
              
              <mx:XML id="testXML" xmlns="">
              <root>
                  <item name="row 1" value="3000"/>
                  <item name="row 2" value="2000"/>
                  <item name="row 3" value=""/>
                  <item name="row 4" value="152"/>
                  <item name="row 5" value="6823"/>
                  <item name="row 6" value=""/>
              </root>
              </mx:XML>
              
              <mx:DataGrid x="53" y="95" dataProvider="{testXML.item}">
                  <mx:columns>
                      <mx:DataGridColumn headerText="Column 1" dataField="@name"/>
                      <mx:DataGridColumn headerText="Column 2">
                          <mx:itemRenderer>
                              <mx:Component>
                                  <mx:Label text="{data.@value}" toolTip="{this.text != '' ? 'This Rows value is: ' + this.text : ''}"/>
                              </mx:Component>
                          </mx:itemRenderer>
                      </mx:DataGridColumn>
                  </mx:columns>
              </mx:DataGrid>
              
          </mx:Application>
          
          • 2. Re: tooltip
            BhaskerChari Level 4

            Hi Bindu,

             

            Check out the below code...this is what I think you are exactly looking for...

             

            This will work for all the columns...and no need to write the tooTip seperately for all the columns...

             

            <?xml version="1.0" encoding="utf-8"?>
            <!-- http://blog.flexexamples.com/2007/08/12/sorting-date-columns-in-a-datagrid/ -->
            <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
                    layout="vertical"
                    verticalAlign="middle"
                    backgroundColor="white">

             

                <mx:Script>
                    <![CDATA[
                        import mx.utils.ObjectUtil;

             

                        private function date_sortCompareFunc(itemA:Object, itemB:Object):int {
                            var dateA:Date = new Date(Date.parse(itemA.dob));
                            var dateB:Date = new Date(Date.parse(itemB.dob));
                            return ObjectUtil.dateCompare(dateA, dateB);
                        }

             

                        private function dataTipFunc(item:Object):String {
                         if(item.name == "")
                         {
                          dataGrid.showDataTips = false;
                         }
                         else
                         {
                          dataGrid.showDataTips = true;
                         }
                            return dateFormatter.format(item.dob);
                        }
                    ]]>
                </mx:Script>

             

                <mx:ArrayCollection id="arrColl">
                    <mx:source>
                        <mx:Array>
                            <mx:Object name="User A" dob="04/14/1980" />
                            <mx:Object name="User B" dob="01/02/1975" />
                            <mx:Object name="" dob="12/30/1977" />
                            <mx:Object name="User D" dob="10/27/1968" />
                        </mx:Array>
                    </mx:source>
                </mx:ArrayCollection>

             

                <mx:DateFormatter id="dateFormatter" formatString="MMMM D, YYYY" />

             

                <mx:DataGrid id="dataGrid" showDataTips="true" dataProvider="{arrColl}">
                    <mx:columns>
                        <mx:DataGridColumn dataField="name"
                                headerText="Name:" showDataTips="true" />

             

                        <mx:DataGridColumn dataField="dob"
                                headerText="Date of birth:"
                                sortCompareFunction="date_sortCompareFunc"
                                showDataTips="true"
                                dataTipFunction="dataTipFunc" />
                    </mx:columns>
                </mx:DataGrid>

             

            </mx:Application>

             

             

            If this post answers your question or helps, please kindly mark it as such.


            Thanks,

            Bhasker Chari

            • 3. Re: tooltip
              bindu84 Level 1

              hi thanx for reply

               

               

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

              <mx:Application

               

               

              xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">

               

              <mx:Script>

              <![CDATA[

               

               

              import mx.events.ListEvent;

              import

               

               

               

               

              mx.controls.Alert;

              import

               

               

              import

               

               

              import

               

               

              import

               

               

              import mx.events.FlexEvent;

               

              private function init()

              {

               

              this.addEventListener(ListEvent.ITEM_ROLL_OVER,showToolTip);

              }

               

              private function showToolTip(e:ListEvent)

              {

              dg.showDataTips =

              true;

              }

               

              public function addData(event:FlexEvent) : void

              {

               

              if(dg.dataProvider[dg.selectedIndex]['country'] == "Italy")

              ComboBox(event.target).dataProvider = ItalianCities;

               

              else

              ComboBox(event.target).dataProvider = UKCities;

               

              }

               

              private function dataTipFunc(item:Object){

                         

              if(item.name == "")

                           {

                            dg.showDataTips =

              false;

                           }

                         

              else

                           {

                            dg.showDataTips =

              true;

                           }

                      

                  }

               

              private var ItalianCities:Array = [ "Rome", "Perugia", "Riomaggiore", "Lucca" ];

               

               

              private var UKCities:Array = [ "London", "Manchester", "Sussex", "Brighton" ];

               

              [

              Bindable]

               

              private var tripItinerary:Array = [

              {country:

              "United Kingdom", city: "Sussex"},

              {country:

              "Italy", city: "Rome"}

              ];

               

              ]]>

              </mx:Script>

              <mx:AdvancedDataGrid

               

              id="dg" dataProvider="{tripItinerary}" editable="true">

              <mx:columns>

              <mx:AdvancedDataGridColumn

               

              dataField="country" headerText="Country" editable="false" showDataTips="true" dataTipFunction="dataTipFunc" />

              <mx:AdvancedDataGridColumn

               

              dataField="city" headerText="Destination City" editorDataField="selectedItem" showDataTips="true" >

              <mx:itemEditor>

              <mx:Component>

              <mx:ComboBox

               

              initialize="outerDocument.addData(event)" />

              </mx:Component>

              </mx:itemEditor>

              </mx:AdvancedDataGridColumn>

              </mx:columns></mx:AdvancedDataGrid>

               

              </mx:Application>

               

               

               

               

              i have used that code but i have not get item.name property in item object

              mx.controls.ComboBox;

               

              mx.collections.ArrayCollection;
              mx.rpc.xml.SimpleXMLDecoder;
              mx.utils.ArrayUtil;
              • 4. Re: tooltip
                BhaskerChari Level 4

                Hi Bindu,

                 

                Instead of item.name you need to use the corresponding property in your ArrayCollection in which you want to check for null or empty condition..

                 

                Either you can use country or city...I think....Use the field or property on which you want to check for the empty cell...

                 

                 

                if(item.country == "") or if(item.city  == "")

                 

                 

                 

                Thanks,

                Bhasker Chari

                • 5. Re: tooltip
                  bindu84 Level 1

                  this is just an example , i have runtime datagrid colums are st at runime so i cant do this like tthat way