topic Re: Integrating a Datagrid on Pop-up in ArcGIS API for Flex Questions

Integrating a Datagrid on Pop-up

kaarimelmaanani — Sun, 12 Dec 2021 00:26:19 GMT

Hi
i'm working on Flex viewers 2.5 source code and the Flash builder 4.6

First i wanted to add a pop-up on the maps containing few line on the texte by following this example http://help.arcgis.com/en/webapps/flexviewer/help/index.html#/Pop_up_configuration_files/01m30000002q000000/ .. and every thing gone alright
But when I tried to add a small datagrid on This Pop-up windows it doesn't work it throw an error (Error #1083).

Does any one knows how i can do it

Few line of my source code

<description>
<![CDATA[<b>................. " text"
        </b> <A HREF="http://..../"> see more... </A> 
       
        ]]>
  
  <mx:DataGrid width="100%" height="40%" sortableColumns="True"  editable ="true">
        <mx:columns>
            <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>

</description>

Thank you

Regards Km

Re: Integrating a Datagrid on Pop-up

RobertScheitlin__GISP — Thu, 07 Jun 2012 14:34:45 GMT

Kaarim,

There is a forum specific to the Flex Viewer that you should post Flex Viewer questions to:

http://forums.arcgis.com/forums/111-ArcGIS-Viewer-for-Flex

The CDATA section in the description can only have a very limited subset of HTML tags. It does not support MXML code. to do what you want you will have to modify extend the Flex API's PopUpRendererSkin.mxml (obtained from the Flex API source download, not part of the Flex Viewers source).

Don't forget to click the Mark as answer check on this post and to click the top arrow (promote).
Follow the steps as shown in the below graphic:

Re: Integrating a Datagrid on Pop-up

kaarimelmaanani — Fri, 08 Jun 2012 08:56:27 GMT

Thanks for replying rscheitlin

But i don't get what your told me to do
i have downloaded " PopUpRendererSkin.mxml " from the API Source code , do i have to import it in my flex viewers porject under the popups package ?
i'm lost .. i don't have any idea how to proceed

Can you give me more details about the step to do ?

Re: Integrating a Datagrid on Pop-up

RobertScheitlin__GISP — Sun, 12 Dec 2021 00:26:22 GMT

Kaarim,

Yes you take the PopUpRenderer.mxml from the API download and place it in your Flex Viewer project either in your widgets package folder or the src/com/esri/viewer/skins/ folder and make your code changes by adding the datagrid to the fx Declarations section and in the commitProperties function is where you add it to the vGroup. You will then need to add these lines to the default.css in your project.

esri|PopUpRenderer
{
    skin-class: ClassReference("com.esri.viewer.skins.PopUpRendererSkin");
}

That shows you the basics of getting started. I assume because you are even attempting this that you have the coding skill to get done what you are attempting.

Don't forget to click the Mark as answer check on this post and to click the top arrow (promote).
Follow the steps as shown in the below graphic:

Re: Integrating a Datagrid on Pop-up

kaarimelmaanani — Fri, 08 Jun 2012 12:53:56 GMT

Thanks for the answer

Kaarim,
/ and make your code changes by adding the datagrid to the fx Declarations section and in the commitProperties function is where you add it to the vGroup. You will then need to add these lines to the default.css in your project.

But i still don't get it .. can you be more patient and give me some explanation ..

Regards KM

Re: Integrating a Datagrid on Pop-up

RobertScheitlin__GISP — Fri, 08 Jun 2012 13:05:08 GMT

Kaarim,

What part are you not understanding?

Re: Integrating a Datagrid on Pop-up

kaarimelmaanani — Sun, 12 Dec 2021 00:26:25 GMT

The parts In quotes ..

adding the datagrid to the fx Declarations section i used this ( a blank grid)

<mx:DataGrid width="100%" height="40%" sortableColumns="True"  editable ="true">
   <mx:columns>
    <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>

and in the commitProperties function is where you add it to the vGroup. How ? do you have any example

Thanks

Re: Integrating a Datagrid on Pop-up

RobertScheitlin__GISP — Fri, 08 Jun 2012 13:53:27 GMT

Kaarim,

No I don't have an example, I am providing advice not actually doing the coding. If you look at the commitProperties function you will see how other items that are in the declarations section are added by using the vGroup.addElement and then using the id of the component in the declarations section (I notice that you datagrid does not have an id). If you are struggling with this part you are probably in over your head.