8 Replies Latest reply on Jul 12, 2007 2:14 PM by deKolonel

    Datagrid Refresh

      I have a datagrid whos dataprovider is the result from a HTTPService it populates correctly and looks great, However I have a combobox that is used to change the dataField. How can I tell the datagrid to refresh/reload so that it will display the values from the new dataField>
        • 1. Re: Datagrid Refresh
          peterent Level 2
          You can either reset the DataGrid's dataProvider to the new object containing the new values, or if you are just re-populating an existing dataProvider Collection, make sure to use the Collection's itemUpdated function. If you are changing a lot of the values, disable the update notification until the end:


          That will tell all interested parties the data has been changed.
          • 2. Re: Datagrid Refresh
            texas_stingray Level 1
            Let me rephrase the issues. the screen is not refreshing on the datagrid unless I scroll up and down how can I force the screen refresh.
            • 3. Re: Datagrid Refresh
              ntsiii Level 3
              What is your dataProvider, and how are you updating it?
              • 4. Re: Datagrid Refresh
                texas_stingray Level 1
                DataGrid Code Below

                <mx:DataGrid id="TotalsDataGrid" click="TotalVolumeClick(event)" dataProvider="{HTTPServVolume.lastResult.month}" visible="true" left="0" right="0" bottom="30" top="0">
                <mx:DataGridColumn headerText="Date" dataField="date"/>
                <mx:DataGridColumn id="TotalsDGVolume" headerText="Total Volume" dataField="oil"/>

                HTTP Service Below:
                <mx:HTTPService id="HTTPServVolume" url="totalvolume.xml" method="POST" resultFormat="e4x" useProxy="false" showBusyCursor="true" result="HTTPVolumeResults()" fault="HTTPServFault(event);"/>

                totalvolume.xml Below:

                Switching dataField Below:

                • 6. Re: Datagrid Refresh
                  ntsiii Level 3
                  Ah, nice try, but there are a couple problems.

                  First, you can't refer to a dataGridColumn by id, it has no such property. You can access it using the dataGrid.columns array, and you will be able to set the dataField through that reference.

                  This is essentially rebuilding the DataGrid dynamically. Here is a link to an example that builds a datagrid dynamically. It will help you understand the theory:

                  Now, to make this all work, you will have to change the way you are assigning the dataProvider to the datagrid, because you will have to re-assign it after modifying the columns.

                  First, don't bind directly to lastResult. Instead, create an instance variable typed as XML: private var _xmlTotalVolume:XML;

                  Pass the event to the result handler:

                  Import the result event:
                  import mx.rpc.events.ResultEvent;

                  In the result handler do:
                  private function HTTPVolumeResults(event:ResultEvent)
                  _xmlTotalVolume = XML(event.result);
                  TotalsDataGrid.dataProvider = _xmlTotalVolume;

                  Your DataGrid should display normally.

                  Now, after you modify the columns array, you will aggain assign the dataProvider:
                  TotalsDataGrid.dataProvider = _xmlTotalVolume;

                  Another way to achieve this effect would be to programatically hide and display the three columns as desired. You still must use the columns array techniques.

                  • 7. Re: Datagrid Refresh
                    texas_stingray Level 1
                    Actualy there is an id for the DataGridColumn and it does work. I saw another post and got wat i wanted just by resetting the datagrid dataProvider after I change to DataGridColumn.dataField

                    • 8. Re: Datagrid Refresh

                      what I did was just create a updateGrid fuction that runs when clicking a button to say add or delete a row.

                      like this:

                      public function updateGrid():void {
                      initApp(); //Make sure this initiate the filling of the datagrid!!

                      <mx:Button id="addRow" click="this.updateGrid();"