5 Replies Latest reply on Feb 3, 2011 9:32 PM by BhaskerChari

    How to avoid updating a dataprovider when datagrid cell is edited ?

    Shweta Gothe Level 1

      Hi,

       

      I have a datagrid which shows employee infromation and in a HBOX (Below datagrid) two buttons :  RESET and SUBMIT.

       

      User can edit the data grid cel.When he edits a cell data provider is  also  showing the updated cell value.

       

      I want to prevent the updation of dataprovider after editing the cell.

       

      I want to update the dataprovider when he clicks submit,

       

      When a user clicks Reset I want  the original data back in the datagrid.

       

      In short , I want to update the dataprovider only when user clicks SUBMIT.How can I achieve that ?

       

      Thanks,
      Shweta

        • 1. Re: How to avoid updating a dataprovider when datagrid cell is edited ?
          Flex harUI Adobe Employee

          Make a copy of the original data beforehand.  Use toArray() to make a copy.

          1 person found this helpful
          • 2. Re: How to avoid updating a dataprovider when datagrid cell is edited ?
            Shweta Gothe Level 1

            Thanks for the solution.

             

            Is there any  solution other than making a copy ? Can we do anything on ItemEditEnd event of datagrid which can prevent updating a data provider ?

             

            Thanks.

            • 3. Re: How to avoid updating a dataprovider when datagrid cell is edited ?
              BhaskerChari Level 4

              Hi Shweta,

               

              Hope this is what you required..If not please make it clear...what exact you need

               

              <?xml version="1.0"?>
              <!-- itemRenderers\events\EndEditEventAccessEditor.mxml -->
              <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" creationComplete="init()">
                 
                  <mx:Script>
                      <![CDATA[
                       import mx.utils.ObjectUtil;
                       import mx.controls.Alert;
                     
                          import mx.controls.TextInput;
                          import mx.events.DataGridEvent;
                          import mx.collections.ArrayCollection;
                     
                          [Bindable]
                          private var dpOriginal:ArrayCollection = new ArrayCollection([
                              {Artist:'Pavement', Album:'Slanted and Enchanted',
                                  Price:11.99},
                              {Artist:'Pavement', Album:'Brighten the Corners',
                                  Price:11.99 }
                          ]);
                          [Bindable]
                          private var dpCopy:ArrayCollection = new ArrayCollection();
                         
                          private function init():void {
                           //Create a copy
                           dpCopy = ObjectUtil.copy(dpOriginal) as ArrayCollection;
                           myGrid.dataProvider = dpOriginal;
                          }
                          // Define event listener for the itemEditEnd event.
                          private function getCellInfo(event:DataGridEvent):void {
                             
                              // Get the cell editor and cast it to TextInput.
                              var myEditor:TextInput =  TextInput(event.currentTarget.itemEditorInstance);
                             
                              // Get the new value from the editor.
                              var newVal:String = myEditor.text;
                              // Get the old value.
                              var oldVal:String = event.currentTarget.editedItemRenderer.data[event.dataField];
                          
                           dpCopy.getItemAt(event.rowIndex)[event.dataField] = newVal;
                           myEditor.text = oldVal;
                          
                          }
                          private function submitBtnClickHandler():void
                          {
                           dpCopy.refresh();
                           myGrid.dataProvider = dpCopy;
                          
                          }
                          private function resetBtnClickHandler():void
                          {
                           myGrid.dataProvider = dpOriginal;
                          }
                      ]]>
                  </mx:Script>
                  <mx:VBox verticalGap="10">
                   <mx:DataGrid id="myGrid" 
                       editable="true"
                       itemEditEnd="getCellInfo(event);" >   
                       <mx:columns>
                           <mx:DataGridColumn dataField="Artist"/>
                           <mx:DataGridColumn dataField="Album"/>
                           <mx:DataGridColumn dataField="Price"/>
                       </mx:columns>      
                   </mx:DataGrid>
                   <mx:HBox horizontalGap="10">
                    <mx:Button label="SUBMIT" click="submitBtnClickHandler()" />
                    <mx:Button label="RESET" click="resetBtnClickHandler()" />
                   </mx:HBox>
                  </mx:VBox>
                 
              </mx:Application>

               

              Thanks,

              Bhasker

              • 4. Re: How to avoid updating a dataprovider when datagrid cell is edited ?
                Shweta Gothe Level 1

                Bhasker , Thanks for your reply.

                 

                 

                Actually I want the user to edit the cells but I dont want to update the dataprovider.I want to update the dataprovider only when he clicks submit.

                 

                When he clikcs on Reset I want the original datagrid to be seen (edited data should be reset to the original data on the grid).

                 

                Thanks,

                Shweta

                • 5. Re: How to avoid updating a dataprovider when datagrid cell is edited ?
                  BhaskerChari Level 4

                  Hi Shweta,

                   

                  Have you tested the sample code which I have posted in my previous post.??

                   

                  If so what drawbacks did you find compared to your case..??

                   

                  In the code which I posted when the user edit the cells then he can change the data and as soon as the focus leaves the cell the data again reverts back...and I think at this moment you still want the data to be retained in the cell even the user focus out of the cell(which is not happening in the current code)...However when you click the submit it will update the dataprovider and the grid as well also resets the datagrid to original data when you click the Reset button.

                   

                   

                  Thanks,

                  Bhasker