Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium

x
?
Solved

Help in datagrid FLEX

Posted on 2011-05-05
4
Medium Priority
?
293 Views
Last Modified: 2012-05-11
I need to drag the column to the first grid and capture the name of the column in order to determine whether the column is visible or not. See sample:

http://www.techall.com.br/GRID/Index.html
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" width="100%" height="100%" backgroundGradientAlphas="[1.0, 1.0]" backgroundGradientColors="[#FFFFFF, #FFFFFF]">
<mx:Script>
	<![CDATA[
		
		
		
		
		
	]]>
</mx:Script>
<mx:Style>
	Application {
        backgroundImage:"Imagem/fundo2.jpg";
    }
</mx:Style>
<mx:XMLList id="employees">
        <employee>
            <name>Christina Coenraets</name>
            <phone>555-219-2270</phone>
            <email>ccoenraets@fictitious.com</email>
            <active>true</active>
            <image>images/arrow_icon_sm.png</image>
        </employee>
        <employee>
            <name>Joanne Wall</name>
            <phone>555-219-2012</phone>
            <email>jwall@fictitious.com</email>
            <active>true</active>
        </employee>
        <employee>
            <name>Maurice Smith</name>
            <phone>555-219-2012</phone>
            <email>maurice@fictitious.com</email>
            <active>false</active>
        </employee>
        <employee>
            <name>Mary Jones</name>
            <phone>555-219-2000</phone>
            <email>mjones@fictitious.com</email>
            <active>true</active>
        </employee>
    </mx:XMLList>
	<mx:Canvas y="77" width="1000" height="692" backgroundColor="#FFFFFF" alpha="1.0" borderStyle="solid" cornerRadius="10" horizontalCenter="8" borderThickness="3" backgroundAlpha="0.36">
		<mx:ViewStack x="0" y="0" id="viewstack1" width="994" height="686">
			<mx:Canvas label="View 1" width="100%" height="100%">
				<mx:Canvas x="10" y="10" width="165" height="666" backgroundColor="#FFFFFF" borderStyle="solid" cornerRadius="10" backgroundAlpha="0.19">
					<mx:Canvas x="0" y="0" width="163" height="664" horizontalScrollPolicy="off">
						<mx:Canvas x="0" y="0" width="163" height="914">
							<mx:DataGrid x="5" y="10" width="138" height="255" dataProvider="[]" color="#000000" fontWeight="bold"  dragEnabled="true" dropEnabled="true" dragMoveEnabled="true">
								<mx:columns>
									<mx:DataGridColumn headerText="AGRUPAMENTO" dataField="name"/>
								</mx:columns>
							</mx:DataGrid>
							<mx:DataGrid x="6" y="285" width="137" height="255" color="#000000" fontWeight="bold">
								<mx:columns>
									<mx:DataGridColumn headerText="EXIBIR COLUNAS" dataField="col1"/>
								</mx:columns>
							</mx:DataGrid>
							<mx:DataGrid x="4" y="595" width="138" height="89" color="#000000" fontWeight="bold">
								<mx:columns>
									<mx:DataGridColumn headerText="FILTRAR COLUNA" dataField="col1"/>
								</mx:columns>
							</mx:DataGrid>
							<mx:HRule x="2" y="272" height="5" width="160"/>
							<mx:HRule x="2" y="582" height="5" width="160"/>
							<mx:DataGrid x="10" y="755" width="133" height="149" color="#000000" fontWeight="bold">
								<mx:columns>
									<mx:DataGridColumn headerText="CÁLCULAR COLUNA" dataField="col1"/>
								</mx:columns>
							</mx:DataGrid>
							<mx:HRule x="2" y="742" height="5" width="160"/>
							<mx:HRule x="2" y="692" height="5" width="160"/>
							<mx:CheckBox x="26" y="548" label="EXIBIR TODAS" fontWeight="bold" color="#000000"/>
							<mx:CheckBox x="26" y="708" label="QUANTIDADE" fontWeight="bold" color="#000000"/>
						</mx:Canvas>
					</mx:Canvas>
				</mx:Canvas>
				<mx:Canvas x="183" y="10" width="801" verticalScrollPolicy="off" horizontalScrollPolicy="off" height="44" backgroundColor="#FFFFFF" borderStyle="solid" cornerRadius="10" backgroundAlpha="0.19">
					<mx:Label x="11" y="12" text="EXPORTAR EM:" fontStyle="normal" fontWeight="bold" color="#000000"/>
					<mx:Image x="124" y="3" source="Imagem/EXCEL.png"/>
					<mx:Image x="168" y="3" source="Imagem/WORD.png"/>
					<mx:Image x="211" y="4" source="Imagem/IE.png"/>
					<mx:Image x="253" y="4" source="Imagem/PDF.png"/>
					<mx:Image x="312" y="3" source="Imagem/GRAFICOS.png" buttonMode="true" click="{GRAFICOS.visible = true}"/>
					<mx:VRule x="291" y="6" width="6" height="32"/>
					<mx:Label x="441" y="14" text="FILTRAR" fontStyle="normal" fontWeight="bold" color="#000000"/>
					<mx:TextInput x="504" y="11" width="285"/>
				</mx:Canvas>
				<mx:Canvas x="183" y="62" width="801" height="563">
					<mx:DataGrid x="0" y="0" width="1500" dataProvider="{employees}" height="544" id="GRID" allowMultipleSelection="true" dragEnabled="true" dragMoveEnabled="true">
						<mx:columns>
							<mx:DataGridColumn headerText="Column 1" dataField="name" id="a"/>
							<mx:DataGridColumn headerText="Column 2" dataField="phone"/>
							<mx:DataGridColumn headerText="Column 3" dataField="email"/>
							<mx:DataGridColumn headerText="Column 1" dataField="active"/>
							<mx:DataGridColumn headerText="Column 2" dataField="col2"/>
							<mx:DataGridColumn headerText="Column 3" dataField="col3"/>
							<mx:DataGridColumn headerText="Column 1" dataField="col1"/>
							<mx:DataGridColumn headerText="Column 2" dataField="col2"/>
							<mx:DataGridColumn headerText="Column 3" dataField="col3"/>
						</mx:columns>
					</mx:DataGrid>
					<mx:Canvas x="173" y="3" width="269" visible="false" height="60" backgroundColor="#EBEBEE" borderStyle="solid" cornerRadius="10" id="GRAFICOS">
						<mx:LinkButton x="10" y="22" label="PIZZA" color="#000000" themeColor="#E46C01"/>
						<mx:LinkButton x="75" y="22" label="COLUNAS" color="#000000" themeColor="#E46C01"/>
						<mx:LinkButton x="157" y="22" label="BARRAS" color="#000000" themeColor="#E46C01"/>
						<mx:Image x="245" y="2" source="Imagem/1267291268_x.png" buttonMode="true" click="{GRAFICOS.visible = false}"/>
					</mx:Canvas>
				</mx:Canvas>
			</mx:Canvas>
			<mx:Canvas label="A" width="100%" height="100%">
			</mx:Canvas>
		</mx:ViewStack>
	</mx:Canvas>
	<mx:ControlBar x="0" y="0" width="100%" height="55">
		<mx:Image source="Imagem/logo_peq.png"/>
	</mx:ControlBar>
</mx:Application>

Open in new window

0
Comment
Question by:eduardo12fox
  • 2
4 Comments
 
LVL 29

Expert Comment

by:dgofman
ID: 35703409
i cannot understand your requeremetns you can drag ONLY visible columns
0
 
LVL 29

Accepted Solution

by:
Pravin Asar earned 2000 total points
ID: 35703660
Here is a simple example which shows

1. How to determine  the column name of srcGrid (dragInitiator)
2. How to prevent default action when drop is completed to target grid.
3. This code also handles the situations where column(s) from srcGrid are hidden/invisible.

I did not take you code, as this a some external references to images.

I am sure once you follow this example, you can implement to suit your needs.




<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
      <mx:Script>
            <![CDATA[
                  import mx.controls.dataGridClasses.DataGridColumn;
                  import mx.events.DragEvent;
                  public var srcX:int;
                  [Bindable] public var trgData:ArrayCollection = new ArrayCollection();
                  public function srcMouseHandler(evt:MouseEvent):void {
                        
                        srcX=mouseX;
                  }
                  public function trgDragDropHandler(evt:DragEvent):void {
                        evt.preventDefault();
                        var srcGrid:DataGrid = evt.dragInitiator as DataGrid;
                        var column:DataGridColumn = getDataGridColumn(srcX,srcGrid);
                        if (column) {
                              var data:Object = new Object();
                              data.selectedColumn= column.dataField.toString();
                              trgData.addItem(data);
                        }
                  }
                  public function getDataGridColumn(posX:int, dg:DataGrid):DataGridColumn {
                        var dgc:DataGridColumn = null;
                        var pt:Point = new Point(dg.x, dg.y);
                        var gpt:Point = dg.localToGlobal(pt);
                        var dgcX:int=gpt.x;
                        for (var cx:int=0; cx < dg.columns.length; cx++) {
                              dgc=dg.columns[cx] as DataGridColumn;
                              // Handle invisible columns
                              if (!dgc.visible) { continue; }
                              dgcX += dgc.width;
                              if (dgcX > posX) { return dgc; }
                        }
                        return null;
                  }
            ]]>
      </mx:Script>
      <mx:ArrayCollection id="srcData">
            <mx:source>
                  <mx:Object col1="Row 1 Col1" col2="Row 1 Col2" col3="Row 1 Col 3"  col4="Row 1 Col 4"/>
                  <mx:Object col1="Row 2 Col1" col2="Row 2 Col2" col3="Row 2 Col 3"  col4="Row 2 Col 4"/>
                  <mx:Object col1="Row 3 Col1" col2="Row 3 Col2" col3="Row 3 Col 3"  col4="Row 3 Col 4"/>
                  <mx:Object col1="Row 4 Col1" col2="Row 4 Col2" col3="Row 4 Col 3"  col4="Row 4 Col 4"/>
                  <mx:Object col1="Row 5 Col1" col2="Row 5 Col2" col3="Row 5 Col 3"  col4="Row 5 Col 4"/>
            </mx:source>
      </mx:ArrayCollection>
      <mx:HDividedBox x="100" y="100" width="75%" height="75%">
            <mx:DataGrid id="srcGrid" dragEnabled="true" width="75%" height="100%" dataProvider="{srcData}" mouseDown="srcMouseHandler(event);">
                  <mx:columns>
                        <mx:DataGridColumn headerText="Column 1" dataField="col1" visible="false"/>
                        <mx:DataGridColumn headerText="Column 2" dataField="col2"/>
                        <mx:DataGridColumn headerText="Column 3" dataField="col3"/>
                        <mx:DataGridColumn headerText="Column 4" dataField="col4"/>
                  </mx:columns>
            </mx:DataGrid>
            <mx:DataGrid id="trgGrid" dropEnabled="true" width="25%" height="100%" dataProvider="{trgData}" dragDrop="trgDragDropHandler(event);">
                  <mx:columns>
                        <mx:DataGridColumn headerText="Selected Column" dataField="selectedColumn"/>
                  </mx:columns>
            </mx:DataGrid>
      </mx:HDividedBox>
      
</mx:Application>
0
 

Author Closing Comment

by:eduardo12fox
ID: 35705157
This solution very important for project that'm doing. It was perfect! Fantastic!
0
 
LVL 29

Expert Comment

by:Pravin Asar
ID: 35705231
Thanks

0

Featured Post

Sign your company up to try the MB 660 headset now

Take control and stay focused in noisy open office environments with the MB 660. By reducing background noise, you can revitalize your office and improve concentration.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

First things first - Preparation We need all the part for this install and it's much nicer to have them all on hand when you need them so here's what's required. Download Eclipse 3.5 32 bit (I like the Classic flavour) from here. (http://www.e…
Conducting a customer service survey used to be as straightforward as sending a template email out using checkboxes and numerical rating systems to measure satisfaction.
In a question here at Experts Exchange (https://www.experts-exchange.com/questions/29062564/Adobe-acrobat-reader-DC.html), a member asked how to create a signature in Adobe Acrobat Reader DC (the free Reader product, not the paid, full Acrobat produ…
When cloud platforms entered the scene, users and companies jumped on board to take advantage of the many benefits, like the ability to work and connect with company information from various locations. What many didn't foresee was the increased risk…
Suggested Courses

581 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question