asked on

My DataGrid isnt populating when i add a search button.

K so i have an advanced datagrid that is working fine using this the code below and importing the xml (i listed the xml after the code) After this example you will see my new code that is adding a search button. I dont get any errors when running it but i get a warning and the datagrid is not being populated.

The warning says:
Data binding will not be able to detect assignments to "myAC".
Its on line 62 and i will add a little  in the new code located at the bottom.

///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////

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

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" creationComplete="myHS.send() " >
<mx:HTTPService id="myHS" url="data.xml" result="myAC = myHS.lastResult.results.row as ArrayCollection"/>
<mx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
[Bindable]
private var myAC:ArrayCollection;
]]>
</mx:Script>

<mx:Panel width="612" height="456" layout="absolute" horizontalCenter="0" verticalCenter="-18" resizeEffect="Resize" title="Top 25 Report">

<mx:AdvancedDataGrid id="myADG" dataProvider="{myAC}" width="542" variableRowHeight="true" wordWrap="true" height="422" horizontalCenter="0" verticalCenter="2">
<mx:columns>
<mx:AdvancedDataGridColumn headerText="ID" dataField="DIST_ID" styleFunction="highlightCost"/>
<mx:AdvancedDataGridColumn headerText="ROMAN NAME 1" dataField="ROMAN_NAME_1"/>
<mx:AdvancedDataGridColumn headerText="ROMAN NAME 2" dataField="ROMAN_NAME_2" />
</mx:columns>
</mx:AdvancedDataGrid>

</mx:Panel>

      <mx:Script>
<![CDATA[

public function highlightCost(data:Object, column:AdvancedDataGridColumn):Object
{
if (data.DIST_ID > 3000)
return { color : "blue" };
else
return null;
}

]]>
</mx:Script>
</mx:Application>
//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
The xml file looks like this
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
<?xml version="1.0" encoding="ISO-8859-1"?>

<results>

<row>

<DIST_ID>104831</DIST_ID>

<ROMAN_NAME_1>Doerrier, David</ROMAN_NAME_1>

<ROMAN_NAME_2>null</ROMAN_NAME_2>

</row>

<row>

<DIST_ID>104832</DIST_ID>

<ROMAN_NAME_1>Pereira Coutinho, Benjamin</ROMAN_NAME_1>

<ROMAN_NAME_2>null</ROMAN_NAME_2>

</row>

<row>

<DIST_ID>104833</DIST_ID>

<ROMAN_NAME_1>sutton, David A</ROMAN_NAME_1>

<ROMAN_NAME_2>null</ROMAN_NAME_2>

</row>

<row>

<DIST_ID>104834</DIST_ID>

<ROMAN_NAME_1>Berdin, Frian Joy Y</ROMAN_NAME_1>

<ROMAN_NAME_2>null</ROMAN_NAME_2>

</row>

<row>

<DIST_ID>104835</DIST_ID>

<ROMAN_NAME_1>Good Health Maui Inc</ROMAN_NAME_1>

<ROMAN_NAME_2>null</ROMAN_NAME_2>

</row>

</results>
//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
new code with search button
/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
<?xml version="1.0" encoding="utf-8"?>

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" creationComplete="myHS.send() " >
<mx:HTTPService id="myHS" url="data.xml" result="myAC = myHS.lastResult.results.row as ArrayCollection"/>
<mx:Script>
      <![CDATA[
            import mx.collections.SortField;
            import mx.collections.Sort;
            import mx.collections.IViewCursor;
            import mx.events.FlexEvent;
            import mx.collections.ArrayCollection;
            import mx.rpc.events.ResultEvent;

            [Bindable]

            private var cursor:IViewCursor;
            private var myAC:ArrayCollection;

            private function initApp():void
                  {
                  this.myHS.send();
                  }

            private function onResult(evt:ResultEvent):void
                  {
                        var sort:Sort = new Sort();
                        sort.fields = [ new SortField("ID",true) ];
                        this.myAC = evt.result.data.region;
                        this.myAC.sort = sort;
                        this.myAC.refresh();
                        this.cursor = this.myAC.createCursor();
                  }

            private function searchID():void
                  {
                        if(search_ti.text != "")
                              {
                                    if(this.cursor.findFirst({ID:search_ti.text})){
                                          var idx:int = this.myAC.getItemIndex(this.cursor.current);
                                          this.myADG.scrollToIndex(idx);
                                          this.myADG.selectedItem = this.cursor.current;



                                    }
                              }
                  }
      ]]>
</mx:Script>
<mx:Form x="0" y="165">
            <mx:FormItem label="Search">
                  <mx:TextInput id="search_ti"/>
            </mx:FormItem>
                  <mx:FormItem>
                        <mx:Button label="Search ID" click="searchID()"/>
                  </mx:FormItem>
      </mx:Form>

<mx:Panel width="612" height="456" layout="absolute" horizontalCenter="0" verticalCenter="-18" resizeEffect="Resize" title="Top 25 Report">

<mx:AdvancedDataGrid id="myADG" dataProvider="{myAC}" width="542" variableRowHeight="true" wordWrap="true" height="422" horizontalCenter="0" verticalCenter="2">
<mx:columns>
<mx:AdvancedDataGridColumn headerText="ID" dataField="DIST_ID" styleFunction="highlightID"/>
<mx:AdvancedDataGridColumn headerText="ROMAN NAME 1" dataField="ROMAN_NAME_1"/>
<mx:AdvancedDataGridColumn headerText="ROMAN NAME 2" dataField="ROMAN_NAME_2" />
</mx:columns>
</mx:AdvancedDataGrid>

</mx:Panel>

      <mx:Script>
<![CDATA[

public function highlightID(data:Object, column:AdvancedDataGridColumn):Object
{
if (data.DIST_ID > 3000)
return { color : "blue" };
else
return null;
}

]]>
</mx:Script>
</mx:Application>
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
Please Help!!!!

Gary Benade

Your binding is broken. In the code below the only variable that has the required binding is cursor, you need to bind the arraycollection too

[Bindable]

private var cursor:IViewCursor;
private var myAC:ArrayCollection;

It's easy to lose track of whats binded or not, or to copy and move a section of code and forget the binding tag behind, so I always add the binding tag to the same line as it's variable

[Bindable] private var cursor:IViewCursor;
[Bindable] private var myAC:ArrayCollection;

Now it' easy to see the binding and what it binds

Brant Snow

ASKER

Thank you the binding is working now but if i try to use my search button i get a actionscript error that reads Error #1009: Cannot access a property or method of a null object reference. Any idea on that?

Gary Benade

It just means you're accessing a property of an object is null. It could be anywhere, but a likely culprit is onResult. I suggest you run your project in debug mode and then see if you can spot the line that gives the error by F6'ing through the code after setting a breakpoint. Then, add a line to test for null before doing the operation

Brant Snow

ASKER

Found it, but i already had a test for null before.

private function searchID():void
                  {
                        if(search_ti.text != "")
                              {
             if(this.cursor.findFirst({ID:search_ti.text})){
                                          var idx:int = this.myAC.getItemIndex(this.cursor.current);
                                          this.myADG.scrollToIndex(idx);
                                          this.myADG.selectedItem = this.cursor.current;



                                    }
                              }
                  }

Gary Benade

An empty string isn't the same thing as a string set to null, you can work with the former but the latter would cause an access violation. I suspect the problem is related tho this.cursor being null, probably due to the arraycollection being empty.

private function searchID():void
{
if(search_ti.text != "")
{
if(this.cursor && this.cursor.findFirst({ID:search_ti.text}))
{
var idx:int = this.myAC.getItemIndex(this.cursor.current);
this.myADG.scrollToIndex(idx);
this.myADG.selectedItem = this.cursor.current;
}
}
}

I'm also concerned about this code:
myAC = myHS.lastResult.results.row as ArrayCollection

Are you sure myHS.lastResult.results.row is an ArrayCollection, because if it isn;t the cast you are performing will cause muAC to be null. It would be a better idea to do this:
myAC = new ArrayCollection(myHS.lastResult.results.row)

Are you sure the array isn't sitting in myHS.lastResult.results?
myAC = new ArrayCollection(myHS.lastResult.results)

Brant Snow

ASKER

ya im pretty sure i do want lastResult.results.row as a Array Collection but my understanding of Flex is limited. I have attached the source code. I put in your new private function but the search tool is not returning anything and if i change my myAC = myHS.lastResult.results.row as ArrayCollection i am not loading my xml. I have attached a zip file containing the mxml and xml in it. Maybe you can see what im talking about.

Brant Snow

ASKER

Crap it wont let me upload the xml, i guess i posted it above so you could just drop it into a notepad or something.

Gary Benade

email me gary at softwareguys dot co dot za

ASKER CERTIFIED SOLUTION

Gary Benade

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

Brant Snow

ASKER

Thank you so much, you are awesome