HttpService with JSON from server - help please

[rohit_rai]

Hi!

I am trying to pass back a JSON object to flex using
HttpService. The scenario is like this - using HttpService I am
calling an action since i am using Struts 2.0 . This action is
supposed to return a string in JSON format. When i am passing back
the data in XML format the data is properly displayed with the
required hierarchail structure. But when I am passing back the JSON
string it is not displaying anything.



This is the call to server

<mx:HTTPService id="srv" url="...... /
myaction/getSomeData.action"/>



the srv value is coming as null.



I am a total newbie to flex.



Thanks for any help in advance,

Rohit

[rohit_rai]

The code is as follows:



<?xml version="1.0"?>



<mx:Application xmlns:mx="
http://www.adobe.com/2006/mxml"
xmlns:ilog="
http://www.ilog.com/2007/ilog/flex"
layout="absolute" creationComplete="srv.send()">



<mx:HTTPService id="srv" url="
http://192.168.103.128:8081/ManageMe/manageme/generateXMLForGantt.action"/>




<mx:Style>



GanttSheet



{



borderStyle:none;



rowPadding: 4;



}



TaskItemRenderer {



borderColor: "0x388F24";



backgroundColor: "0xB5D021";



rollOverColor: "0xFDF621";



borderRollOverColor: "0xF4C811";



selectedColor: "0xFDB201";



borderSelectedColor: "0xFF9201";



selectedRollOverColor: "0xFDF621";



borderSelectedRollOverColor: "0xF4C811";



textPosition: "right";



v-align: "top";



barTopMargin: 0.3;



barBottomMargin: 0.3;



}



.milestone {



startSymbolBorderColor: "0x24598a";



startSymbolColor: "0x4422EE";



}



.summary {



borderColor: "0x000000";



backgroundColor: "0x22ee56";



endSymbolBorderColor: "0x000000";



endSymbolColor: "0x000000";



startSymbolBorderColor: "0x000000";



startSymbolColor: "0x000000";



}



</mx:Style>



<mx:Script>



<![CDATA[



import mx.collections.ArrayCollection;



import mx.collections.HierarchicalData;







[Bindable]



public var tasks:HierarchicalData = new
HierarchicalData(srv);







//[Bindable]



// public var tasks:HierarchicalData = null;







[Bindable]



public var constraints:ArrayCollection = new
ArrayCollection([



{ fromId:"T2", toId:"T3", kind:"endToStart" },



{ fromId:"T3", toId:"T4", kind:"endToStart" },



{ fromId:"T5", toId:"T6", kind:"endToStart" },



{ fromId:"T6", toId:"T7", kind:"endToStart" },



{ fromId:"T7", toId:"T8", kind:"endToStart" },



{ fromId:"T7", toId:"T8", kind:"endToStart" }



]);



]]>







</mx:Script>







<mx:VBox width="100%" height="100%">







<mx:ApplicationControlBar id="toolBar" width="100%"
height="40">



<mx:HBox>



<mx:Button toolTip="Expand All Items" width="30"
height="28" click="myDataGrid.expandAll()"
icon="@Embed(source='../resources/expanded.png')"/>



<mx:Button toolTip="Collapse All Items" width="30"
height="28" click="myDataGrid.collapseAll();"
icon="@Embed(source='../resources/unhierarchical.png')"/>



<mx:Button toolTip="Zoom In" width="30" height="28"
icon="@Embed(source='../resources/zoom in5.png')"/>



<mx:Button toolTip="Zoom Out" width="30" height="28"
icon="@Embed(source='../resources/zoom out7.png')"/>



<!--<mx:Button toolTip="Expand Chart" width="30"
height="28" click="myGanttSheet.showAll(margin=10);"
icon="@Embed(source='../resources/zoom fit6.png')"/> -->



</mx:HBox>



</mx:ApplicationControlBar>







<ilog:TaskChart id="taskChart" width="100%" height="100%"



taskDataProvider="{srv.lastResult}"



taskItemStyleName="TaskItemRenderer" >



<ilog:dataGrid>



<ilog:GanttDataGrid id="myDataGrid" rowHeight="24">



<ilog:columns>



<mx:AdvancedDataGridColumn dataField="id"
headerText="ID"/>



<mx:AdvancedDataGridColumn dataField="name"
headerText="NAME"/>



<mx:AdvancedDataGridColumn dataField="baselineStart"
headerText="START TIME"/>



<mx:AdvancedDataGridColumn dataField="baselineEnd"
headerText="END TIME"/>



</ilog:columns>



</ilog:GanttDataGrid>



</ilog:dataGrid>



<ilog:ganttSheet>



<ilog:GanttSheet id="myGanttSheet"
taskItemRenderer="TaskChartCustomTaskItemRenderer"
moveEnabled="false" resizeEnabled="false"/>



</ilog:ganttSheet>



</ilog:TaskChart>







</mx:VBox>



</mx:Application>

[atta707 · Accepted solution]

First off, you'll need to read your response as a simple text
by specifying resultFormat="text" in your service:



<mx:HTTPService id="srv" url="
http://192.168.103.128:8081/ManageMe/manageme/generateXMLForGantt.action"
resultFormat="text"/>



Now in your result event you'll read the response as simple
text:



var rawData:String = String(event.result);



Of course, now you need to encode this string as JSON Object.
Flex don't have a built-in JSON encoder/decoder. So here is library
done by Adobe/Flex folks that hanldes JSON:




http://code.google.com/p/as3corelib/



Once you've downloaded this library and have copied in your
lib foleder, the next line would look like:



try {

//Alert.show(rawData);

var o:Object = JSON.decode(rawData);

Alert.show(o['baselineEnd']);



}

catch(e:Error) {

// handle error

}





should work!



ATTA