Databases
StackOverflow2013
Postsdbo
POFlex Datagrid + Tab Navigator
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POFlex Datagrid + Tab Navigator
    primarykey
    data
    text
    <p>I have a several datagrids (with data being retrieved from some map service). </p> <p>I want to place these data grids within seperate tabs of a tab navigator. All works fine apart from the first tab which always ends up without any datagrid in it. </p> <p>I have tried creation policy="all" and stuff but the first tab always is empty. Does anybody have any ideas as to why the first tab is always empty.</p> <p>Any workarounds.</p> <p>Thanks</p> <pre><code>var box:HBox=new HBox(); var dg:DataGrid = new DataGrid(); dg.dataProvider = newAC; box.label=title.text; box.addChild(dg); tabNaviId.addChild(box); tabNaviId.selectedIndex=2; resultsArea.addChild(tabNaviId); </code></pre> <p>dg is datagrid that is being filled up. The above code is in a loop, in each loop i am creating an Hbox+datagrid. then i am adding the Hbox to the navigator and final adding the navigator to resultsArea (which is a canvas).</p> <p>The above code works great apart from first time. </p> <p>The end result i get is, having a tab navigator with first tab without any datagrid but the remaining tabs all have the datagrids. Any ideas as to why this is happening.</p> <p>Call to a function called createDatagrid is made:</p> <pre><code>dgCollection.addItem(parentApplication.resultsPanel.createDatagrid( token.name.toString() + " (" + recAC.length + " selected)", recAC, false, callsToMake )); </code></pre> <p>In another Mxml component this function exists</p> <pre><code>public function createDatagrid(titleText:String, recACAll:ArrayCollection, showContent:Boolean, callsToMake:Number):DataGrid { var dg:DataGrid = new DataGrid(); var newAC:ArrayCollection = new ArrayCollection(); var newDGCols:Array = new Array(); for( var i:Number = 0; i &lt; recACAll.length; i ++) { var contentStr:String = recACAll[i][CONTENT_FIELD]; var featureGeo:Geometry = recACAll[i][GEOMETRY_FIELD]; var iconPath:String = recACAll[i][ICON_FIELD]; var linkStr:String = recACAll[i][LINK_FIELD]; var linkNameStr:String = recACAll[i][LINK_NAME_FIELD]; var featurePoint:MapPoint = recACAll[i][POINT_FIELD]; var titleStr:String = recACAll[i][TITLE_FIELD]; if( contentStr.length &gt; 0) { var rows:Array = contentStr.split("\n"); var tmpObj:Object = new Object(); if(!showContent) { for( var j:Number = 0; j &lt; rows.length; j++) { var tmpStr:String = rows[j] as String; var header:String = tmpStr.substring(0,tmpStr.indexOf(":")); var val:String = tmpStr.substring(tmpStr.indexOf(":") + 2); if(header.length &gt; 0) { tmpObj[header] = val; if(newDGCols.length &lt; rows.length - 1) { newDGCols.push( new DataGridColumn(header)); } } } } else { if(newDGCols.length == 0) { newDGCols.push(new DataGridColumn(CONTENT_FIELD)); newDGCols.push(new DataGridColumn(GEOMETRY_FIELD)); newDGCols.push(new DataGridColumn(ICON_FIELD)); newDGCols.push(new DataGridColumn(LINK_FIELD)); newDGCols.push(new DataGridColumn(LINK_NAME_FIELD)); newDGCols.push(new DataGridColumn(POINT_FIELD)); newDGCols.push(new DataGridColumn(TITLE_FIELD)); } } tmpObj[CONTENT_FIELD] = contentStr; tmpObj[GEOMETRY_FIELD] = featureGeo; tmpObj[ICON_FIELD] = iconPath; tmpObj[LINK_FIELD] = linkStr; tmpObj[LINK_NAME_FIELD] = linkNameStr; tmpObj[POINT_FIELD] = featurePoint; tmpObj[TITLE_FIELD] = titleStr; newAC.addItem(tmpObj); } if( showHidePic.source == minSourceI ) { showHidePic.source = minSource; } else if( showHidePic.source == maxSourceI ) { showHidePic.source = maxSource; } curResults = curResults + recACAll.length; if (curResults == 1) { showInfoWindow(tmpObj); if(showContent) { parentApplication.maps.map.extent = featureGeo.extent; } } else { showInfoWindow(null); // Added to avoid the overview button problem (needs checking) this.removeEventListener(MouseEvent.MOUSE_OVER, handleMouseOver, false); this.removeEventListener(MouseEvent.MOUSE_MOVE,handleMouseOver,false); this.removeEventListener(MouseEvent.MOUSE_OUT,handleMouseOut,false); this.removeEventListener(MouseEvent.MOUSE_DOWN,handleMouseDrag,false); this.removeEventListener(MouseEvent.MOUSE_UP,handleMouseDragStop,false); this.parent.removeEventListener(MouseEvent.MOUSE_MOVE,handleParentMove,false); this.parent.removeEventListener(MouseEvent.MOUSE_UP,handleMouseDragStop2,false); maximizePanel(); } } dg.dataProvider = newAC; dg.columns = newDGCols; dg.rowCount = newAC.length; var totalDGCWidth:Number = 0; for( var m:Number = 0; m &lt; dg.columns.length; m++) { var dgc2:DataGridColumn = dg.columns[m]; /*if(dgc2.headerText.toUpperCase()==LINK_FIELD.toUpperCase()){ //dgc.itemRenderer=new ClassFactory(CustomRenderer); dgc2.itemRenderer=new ClassFactory(CustomRenderer); }*/ var dgcWidth2:Number = dgc2.headerText.length * CHAR_LENGTH; for( var l:Number = 0; l &lt; newAC.length; l++) { var row2:Object = newAC.getItemAt(l) as Object; var rowVal2:String = row2[dgc2.headerText]; if( rowVal2 != null) { var tmpLength2:Number = rowVal2.length * CHAR_LENGTH; if(tmpLength2 &lt; CHAR_MAX_LENGTH) { if(tmpLength2 &gt; dgcWidth2) { dgcWidth2 = tmpLength2; } } else { dgcWidth2 = CHAR_MAX_LENGTH break; } } } // Added by FT:to change the item renderer for link field if( dgc2.headerText == GEOMETRY_FIELD || dgc2.headerText == CONTENT_FIELD || dgc2.headerText == ICON_FIELD || dgc2.headerText == LINK_FIELD || dgc2.headerText == POINT_FIELD || dgc2.headerText == TITLE_FIELD || dgc2.headerText == LINK_NAME_FIELD) { if(dgc2.headerText == CONTENT_FIELD &amp;&amp; showContent) { //something } else { dgcWidth2 = 0; } } totalDGCWidth += dgcWidth2; } dg.width = totalDGCWidth; for( var k:Number = 0; k &lt; dg.columns.length; k++) { var dgc:DataGridColumn = dg.columns[k]; var dgcWidth:Number = dgc.headerText.length * CHAR_LENGTH; for( var n:Number = 0; n &lt; newAC.length; n++) { var row:Object = newAC.getItemAt(n) as Object; var rowVal:String = row[dgc.headerText]; if(rowVal != null) { var tmpLength:Number = rowVal.length * CHAR_LENGTH; if(tmpLength &lt; CHAR_MAX_LENGTH) { if(tmpLength &gt; dgcWidth) { dgcWidth = tmpLength; } } else { dgcWidth = CHAR_MAX_LENGTH break; } } } if( dgc.headerText == GEOMETRY_FIELD || dgc.headerText == CONTENT_FIELD || dgc.headerText == ICON_FIELD || dgc.headerText == LINK_FIELD || dgc.headerText == POINT_FIELD || dgc.headerText == TITLE_FIELD || dgc.headerText == LINK_NAME_FIELD) { if(dgc.headerText == CONTENT_FIELD &amp;&amp; showContent) { dgc.visible = true; } else { dgc.visible = false; dgcWidth = 0; } } if( dgc.headerText == LINK_COL_NAME) { dgcWidth = LINK_COL_WIDTH; } dgc.width = dgcWidth; } dg.addEventListener(ListEvent.ITEM_CLICK,rowClicked); dg.addEventListener(ListEvent.ITEM_ROLL_OVER,mouseOverRow); dg.addEventListener(ListEvent.ITEM_ROLL_OUT,mouseOutRow); var title:Text = new Text(); title.text = titleText; title.setStyle("fontWeight","bold"); //resultsArea.addChild(title); return dg; //tabNaviId.selectedIndex=2; } public function populateGrid(dgCollection:ArrayCollection):void{ for( var k:Number = 0; k &lt; dgCollection.length; k++) { var box:HBox=new HBox(); var dg2:DataGrid=dgCollection.getItemAt(k) as DataGrid; box.label="some"; box.addChild(dg2); tabNaviId.addChild(box); } resultsArea.addChild(tabNaviId); } </code></pre> <p>and the tab navigator declared as</p> <pre><code>&lt;mx:Image id="showHidePic" click="toggleResults()"/&gt; &lt;mx:VBox y="20" styleName="ResultsArea" width="100%" height="100%"&gt; &lt;mx:HBox&gt; &lt;mx:Button label="Export to Excel" click="downloadExcel()"/&gt; &lt;mx:Button label="Clear" click="clear()" /&gt; &lt;/mx:HBox&gt; &lt;mx:VBox id="resultsArea" styleName="ResultsContent" paddingTop="10" paddingLeft="10" paddingRight="10" verticalScrollPolicy="off" horizontalScrollPolicy="off"&gt; &lt;mx:TabNavigator id="tabNaviId" width="622" height="274" creationPolicy="all"&gt; &lt;/mx:TabNavigator&gt; &lt;/mx:VBox&gt; &lt;/mx:VBox&gt; </code></pre>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PTQuestion
    1. USAbstract
    1. USAbstract
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. COPosting source would be useful! Without it we will have a hard time helping you.
      singulars
      1. POFlex Datagrid + Tab Navigator
      1. USsean
    2. COAgreed, please provide code, and don't use creationPolicy="all"
      singulars
      1. POFlex Datagrid + Tab Navigator
      1. USJ_A_X
    3. COThanks guys please see the original post for code.
      singulars
      1. POFlex Datagrid + Tab Navigator
      1. USAbstract
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload